/* ======================================================
   GLOBAL FOUNDATION — UDS PUBLIC CATALOG
====================================================== */

body {
    margin:0;
    font-family: Arial, Helvetica, sans-serif;
    color:#222;
    background:#fff;
}

/* MASTER CONTAINER */
.container-public {
    max-width:1400px;
    margin:0 auto;
    padding:0 12px;
}

/* ======================================================
   HEADER — PREMIUM ARCHITECTURAL ALIGNMENT
====================================================== */

.header-slim {
    height:110px;                 /* ↑ increased for real logo */
    display:flex;
    align-items:center;
    background:#5F8695;
}

/* GRID STRUCTURE */
.header-inner {
    display:grid;
    grid-template-columns:auto 1fr auto;
    align-items:center;
}

/* BRAND */

.brand-area {
    display:flex;
    align-items:center;
}

.brand-link {
    display:flex;
    align-items:center;
    text-decoration:none;
    color:#fff;
}

.logo-compact {
    height:78px;                  /* scaled from real logo ratio */
    margin-right:18px;
}

.division-text {
    font-size:16px;
    letter-spacing:2px;
    text-transform:uppercase;
    color:#fff;
    line-height:1.1;
}

/* SEARCH — PREMIUM BASELINE ALIGNMENT */

.search-area {
    padding:0 40px;
}

.search-underline {
    width:100%;
    border:none;
    border-bottom:1px solid rgba(255,255,255,0.55);
    padding:8px 2px 6px;
    font-size:15px;
    outline:none;
    background:transparent;
    color:#fff;
    margin-top:10px;              /* 🔥 aligns with nav baseline */
}

.search-underline::placeholder {
    color:rgba(255,255,255,0.75);
}

/* NAV */

.nav-area {
    justify-self:end;
    text-align:right;
}

.nav-area a {
    margin-left:28px;
    text-decoration:none;
    color:#fff;
    font-size:15px;
}

.nav-area a:hover {
    opacity:.85;
}

/* DIVIDER */

.divider-soft {
    height:1px;
    background:#e3e3e3;
}

/* ======================================================
   HERO / CAROUSEL PLACEHOLDER
====================================================== */

.hero-zone {
    margin-top:0;
}

.hero-placeholder {
    width:100%;
    height:250px;
    overflow:hidden;
    background:#dcdcdc;
}

.hero-placeholder img {
    width:100%;
    height:100%;
    object-fit:cover;
    display:block;
}

/* ======================================================
   SECTIONS
====================================================== */

.section-block {
    margin-top:60px;
}

.section-label {
    font-size:12px;
    letter-spacing:2px;
    text-transform:uppercase;
    color:#888;
    margin-bottom:18px;
}

/* ======================================================
   FEATURED GRID
====================================================== */

.grid-featured {
    display:grid;
    grid-template-columns:repeat(3,1fr);
    gap:28px;
}

.card-featured {
    text-decoration:none;
    color:#222;
}

.img-wrap.portrait {
    aspect-ratio:4/5;
    overflow:hidden;
    background:#eee;
}

.img-wrap img {
    width:100%;
    height:100%;
    object-fit:cover;
    display:block;
}

/* ======================================================
   CATEGORY GRID
====================================================== */

.grid-categories {
    display:grid;
    grid-template-columns:repeat(4,1fr);
    gap:26px;
}

.card-category {
    text-decoration:none;
    color:#222;
}

.img-wrap.square {
    aspect-ratio:1/1;
    overflow:hidden;
    background:#eee;
}

/* ======================================================
   CARD TEXT
====================================================== */

.card-text {
    margin-top:10px;
}

.series-name-small,
.category-title {
    font-size:15px;
    letter-spacing:0.5px;
}

/* ======================================================
   FOOTER — MATCH HEADER WEIGHT
====================================================== */

.footer-minimal {
    margin-top:80px;
    padding:48px 0 30px;
    background:#5F8695;
    font-size:14px;
    color:#fff;
}

.footer-links {
    display:flex;
    justify-content:flex-start;
    gap:26px;
    margin-bottom:18px;
}

.footer-links a {
    text-decoration:none;
    color:#fff;
}

.footer-bottom {
    display:flex;
    justify-content:flex-end;   /* right corner alignment */
    gap:20px;
    flex-wrap:wrap;
}

.footer-bottom a {
    color:#fff;
    text-decoration:none;
}

/* ======================================================
   RESPONSIVE
====================================================== */

@media (max-width:1100px){

.grid-featured {
    grid-template-columns:repeat(2,1fr);
}

.grid-categories {
    grid-template-columns:repeat(2,1fr);
}

}

@media (max-width:900px){

.header-inner {
    grid-template-columns:1fr;
    row-gap:14px;
}

.logo-compact {
    height:64px;
}

.search-area {
    padding:0;
}

.nav-area {
    justify-self:start;
    text-align:left;
}

}

@media (max-width:700px){

.grid-featured,
.grid-categories {
    grid-template-columns:1fr;
}

.hero-placeholder {
    height:180px;
}

}