
/*
 * Hamsa Archives CMS — Archive Presentation System
 * Version 1.2.0
 * Framework-first, content from CMS, visual system from CSS.
 */

.hac-archive{
    --hac-navy:#0d1b2e;
    --hac-navy-2:#16283f;
    --hac-gold:#c99a3a;
    --hac-gold-dark:#9d731f;
    --hac-ink:#182230;
    --hac-muted:#66717e;
    --hac-gray-050:#fafafa;
    --hac-gray-100:#f2f3f3;
    --hac-gray-200:#e3e5e6;
    --hac-gray-300:#cfd3d6;
    --hac-white:#fff;
    color:var(--hac-ink);
    font-family:inherit;
    isolation:isolate;
    background:#fff;
}

.hac-archive *,
.hac-archive *::before,
.hac-archive *::after{box-sizing:border-box}

.hac-archive a{text-decoration:none}
.hac-archive img{max-width:100%}
.hac-container{
    width:min(1180px,calc(100% - 48px));
    margin-inline:auto;
}

/* ---------------------------------------------------------
   SHARED TYPE / EYEBROWS
--------------------------------------------------------- */

.hac-label,
.hac-kicker{
    display:inline-flex;
    align-items:center;
    gap:12px;
    margin:0;
    color:var(--hac-gold-dark);
    font-size:11px;
    line-height:1.2;
    font-weight:800;
    letter-spacing:2.2px;
    text-transform:uppercase;
}

.hac-label::before,
.hac-kicker::before{
    content:"";
    width:28px;
    height:2px;
    flex:0 0 28px;
    background:var(--hac-gold);
}

.hac-heading{max-width:820px;margin:0 0 42px}
.hac-heading h2{
    margin:12px 0 14px;
    color:var(--hac-navy);
    font-size:clamp(30px,3.1vw,42px);
    line-height:1.12;
    letter-spacing:-1.15px;
    font-weight:800;
}
.hac-heading p{
    max-width:760px;
    margin:0;
    color:var(--hac-muted);
    font-size:16px;
    line-height:1.75;
}

/* ---------------------------------------------------------
   HERO
--------------------------------------------------------- */

.hac-hero{
    position:relative;
    overflow:hidden;
    padding:78px 0 86px;
    background:
        linear-gradient(90deg,#f4f5f5 0%,#f4f5f5 52%,#e8eaeb 52%,#eef0f1 100%);
}

.hac-hero::before{
    content:"";
    position:absolute;
    inset:0;
    pointer-events:none;
    opacity:.55;
    background-image:
        linear-gradient(rgba(13,27,46,.035) 1px,transparent 1px),
        linear-gradient(90deg,rgba(13,27,46,.035) 1px,transparent 1px);
    background-size:54px 54px;
}

.hac-hero::after{
    content:"";
    position:absolute;
    top:0;
    right:8%;
    width:22%;
    height:100%;
    background:linear-gradient(90deg,transparent,rgba(201,154,58,.07));
    transform:skewX(-14deg);
    pointer-events:none;
}

.hac-hero .hac-container{position:relative;z-index:1}

.hac-hero-grid{
    display:grid;
    grid-template-columns:minmax(0,.88fr) minmax(0,1.12fr);
    gap:68px;
    align-items:center;
}

.hac-hero-content{
    position:relative;
    z-index:2;
    min-width:0;
    padding:12px 0 12px 4px;
}

.hac-hero-content::before{
    content:"";
    position:absolute;
    left:-24px;
    top:0;
    width:2px;
    height:100%;
    max-height:180px;
    background:linear-gradient(var(--hac-gold),transparent);
}

.hac-hero h1{
    max-width:650px;
    margin:0 0 22px;
    color:var(--hac-navy);
    font-size:clamp(44px,5vw,68px);
    line-height:.98;
    letter-spacing:-2.5px;
    font-weight:850;
}

.hac-hero p{
    max-width:620px;
    margin:0 0 30px;
    color:#56616e;
    font-size:17px;
    line-height:1.78;
}

.hac-btn{
    position:relative;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    gap:12px;
    min-height:50px;
    padding:12px 20px;
    border:1px solid var(--hac-gold);
    background:var(--hac-gold);
    color:#161616!important;
    font-size:12px;
    line-height:1;
    font-weight:800;
    letter-spacing:.6px;
    text-transform:uppercase;
    transition:transform .2s ease,background .2s ease,color .2s ease,box-shadow .2s ease;
}
.hac-btn::after{content:"↗";font-size:16px;line-height:1}
.hac-btn:hover{
    transform:translateY(-2px);
    background:var(--hac-navy);
    border-color:var(--hac-navy);
    color:#fff!important;
    box-shadow:0 12px 25px rgba(13,27,46,.16);
}

/* Hero visual: image is always a filled frame, never a blank box. */
.hac-hero-visual{
    position:relative;
    min-width:0;
    width:100%;
    aspect-ratio:5/4;
    padding:18px 18px 18px 0;
}

.hac-hero-visual::before{
    content:"";
    position:absolute;
    top:0;
    right:0;
    width:82%;
    height:82%;
    border:1px solid rgba(201,154,58,.65);
    pointer-events:none;
}

.hac-hero-visual::after{
    content:"";
    position:absolute;
    left:0;
    bottom:0;
    width:62%;
    height:18%;
    background:var(--hac-navy);
    opacity:.96;
    clip-path:polygon(0 0,100% 0,82% 100%,0 100%);
    pointer-events:none;
    z-index:3;
}

.hac-hero-image-frame{
    position:relative;
    width:100%;
    height:100%;
    overflow:hidden;
    background:var(--hac-navy);
    box-shadow:0 22px 55px rgba(13,27,46,.17);
}

.hac-hero-image-frame::before{
    content:"";
    position:absolute;
    inset:0;
    z-index:2;
    background:
        linear-gradient(135deg,rgba(13,27,46,.18),transparent 48%),
        linear-gradient(0deg,rgba(13,27,46,.30),transparent 38%);
    pointer-events:none;
}

.hac-hero-image-frame img{
    display:block;
    width:100%!important;
    height:100%!important;
    max-width:none!important;
    max-height:none!important;
    margin:0!important;
    padding:0!important;
    border:0!important;
    object-fit:cover!important;
    object-position:center!important;
    vertical-align:middle!important;
    transition:transform .65s cubic-bezier(.2,.7,.2,1);
}
.hac-hero:hover .hac-hero-image-frame img{transform:scale(1.025)}

.hac-hero-image-tag{
    position:absolute;
    left:24px;
    bottom:23px;
    z-index:5;
    color:#fff;
    font-size:10px;
    line-height:1.2;
    font-weight:800;
    letter-spacing:2px;
    text-transform:uppercase;
}

.hac-hero-image-count{
    position:absolute;
    right:22px;
    top:22px;
    z-index:5;
    display:flex;
    align-items:center;
    justify-content:center;
    min-width:52px;
    height:52px;
    padding:0 10px;
    border:1px solid rgba(255,255,255,.45);
    background:rgba(13,27,46,.72);
    backdrop-filter:blur(5px);
    color:#fff;
    font-size:11px;
    font-weight:800;
    letter-spacing:1px;
}

.hac-hero-placeholder{
    position:relative;
    width:100%;
    height:100%;
    overflow:hidden;
    background:
        radial-gradient(circle at 72% 30%,rgba(201,154,58,.28),transparent 20%),
        linear-gradient(135deg,#0d1b2e,#1c344f);
}
.hac-hero-placeholder::before{
    content:"";
    position:absolute;
    width:52%;
    aspect-ratio:1;
    right:-8%;
    top:-15%;
    border:1px solid rgba(201,154,58,.55);
    border-radius:50%;
    box-shadow:
        0 0 0 28px rgba(201,154,58,.035),
        0 0 0 58px rgba(201,154,58,.025);
}
.hac-hero-placeholder::after{
    content:"";
    position:absolute;
    left:12%;
    right:12%;
    bottom:20%;
    height:1px;
    background:linear-gradient(90deg,transparent,rgba(255,255,255,.5),transparent);
    box-shadow:0 -34px 0 rgba(255,255,255,.08),0 34px 0 rgba(255,255,255,.08);
}
.hac-placeholder-title{
    position:absolute;
    left:11%;
    bottom:18%;
    z-index:2;
    max-width:70%;
    color:#fff;
    font-size:clamp(24px,3vw,42px);
    line-height:1;
    font-weight:800;
    letter-spacing:-1px;
}

/* ---------------------------------------------------------
   INTRO / CAPABILITY STRIP
--------------------------------------------------------- */

.hac-intro{
    position:relative;
    padding:92px 0 100px;
    background:#fff;
}

.hac-intro::before{
    content:"";
    position:absolute;
    left:0;
    top:0;
    width:100%;
    height:5px;
    background:linear-gradient(90deg,var(--hac-gold) 0 18%,var(--hac-navy) 18% 82%,var(--hac-gray-200) 82%);
}

.hac-pillars{
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    border-top:1px solid var(--hac-gray-300);
    border-bottom:1px solid var(--hac-gray-300);
}

.hac-pillar{
    position:relative;
    min-height:215px;
    padding:30px 28px 28px;
    border-right:1px solid var(--hac-gray-300);
    background:linear-gradient(180deg,#fff,#f7f8f8);
    overflow:hidden;
}

.hac-pillar:last-child{border-right:0}
.hac-pillar::before{
    content:"";
    position:absolute;
    left:0;
    top:0;
    width:44px;
    height:3px;
    background:var(--hac-gold);
    transition:width .25s ease;
}
.hac-pillar:hover::before{width:100%}

.hac-pillar>span{
    display:block;
    margin-bottom:32px;
    color:var(--hac-gold-dark);
    font-size:10px;
    line-height:1;
    font-weight:800;
    letter-spacing:2px;
}

.hac-pillar h3{
    margin:0 0 11px;
    color:var(--hac-navy);
    font-size:20px;
    line-height:1.25;
    font-weight:800;
}
.hac-pillar p{
    margin:0;
    color:var(--hac-muted);
    font-size:14px;
    line-height:1.7;
}
.hac-note{
    max-width:900px;
    margin:38px 0 0;
    padding:20px 24px;
    border-left:3px solid var(--hac-gold);
    background:#f0f2f2;
    color:#48535f;
    font-size:14px;
    line-height:1.7;
}

/* ---------------------------------------------------------
   DIRECTORY
--------------------------------------------------------- */

.hac-directory{
    position:relative;
    overflow:hidden;
    padding:92px 0 104px;
    background:#eef0f1;
}

.hac-directory::before{
    content:"";
    position:absolute;
    width:380px;
    height:380px;
    right:-190px;
    top:60px;
    border:1px solid rgba(201,154,58,.3);
    border-radius:50%;
    box-shadow:0 0 0 34px rgba(201,154,58,.04),0 0 0 72px rgba(201,154,58,.025);
}

.hac-directory .hac-container{position:relative;z-index:1}

.hac-category-grid{display:grid;gap:26px}
.hac-category-grid-2{grid-template-columns:repeat(2,minmax(0,1fr))}
.hac-category-grid-3{grid-template-columns:repeat(3,minmax(0,1fr))}
.hac-category-grid-4{grid-template-columns:repeat(4,minmax(0,1fr))}

.hac-category-card{
    position:relative;
    min-width:0;
    overflow:hidden;
    border:1px solid #d2d6d8;
    background:#fff;
    box-shadow:0 8px 25px rgba(13,27,46,.06);
    transition:transform .25s ease,box-shadow .25s ease,border-color .25s ease;
}
.hac-category-card:hover{
    transform:translateY(-7px);
    border-color:#b8bdc0;
    box-shadow:0 22px 45px rgba(13,27,46,.13);
}
.hac-category-card::before{
    content:"";
    position:absolute;
    left:0;
    right:0;
    top:0;
    height:4px;
    z-index:5;
    background:var(--hac-gold);
    transform:scaleX(.22);
    transform-origin:left;
    transition:transform .25s ease;
}
.hac-category-card:hover::before{transform:scaleX(1)}

.hac-category-link{
    display:flex;
    flex-direction:column;
    height:100%;
    color:inherit;
}

.hac-category-media{
    position:relative;
    aspect-ratio:16/10;
    overflow:hidden;
    background:var(--hac-navy);
}
.hac-category-media::after{
    content:"";
    position:absolute;
    inset:0;
    background:linear-gradient(0deg,rgba(13,27,46,.35),transparent 55%);
    pointer-events:none;
}
.hac-category-media img{
    display:block;
    width:100%!important;
    height:100%!important;
    max-width:none!important;
    object-fit:cover!important;
    transition:transform .55s ease;
}
.hac-category-card:hover .hac-category-media img{transform:scale(1.05)}

.hac-category-placeholder{
    display:flex;
    align-items:flex-end;
    justify-content:flex-start;
    width:100%;
    height:100%;
    padding:22px;
    background:
        radial-gradient(circle at 78% 22%,rgba(201,154,58,.24),transparent 18%),
        linear-gradient(135deg,#0d1b2e,#29405a);
}
.hac-category-placeholder span{
    color:rgba(255,255,255,.88);
    font-size:42px;
    line-height:1;
    font-weight:800;
    letter-spacing:-2px;
}

.hac-category-number{
    position:absolute;
    top:18px;
    right:18px;
    z-index:4;
    display:flex;
    align-items:center;
    justify-content:center;
    min-width:42px;
    height:42px;
    padding:0 8px;
    border:1px solid rgba(255,255,255,.45);
    background:rgba(13,27,46,.72);
    color:#fff;
    font-size:10px;
    font-weight:800;
    letter-spacing:1px;
}

.hac-category-content{
    display:flex;
    flex:1;
    flex-direction:column;
    padding:25px 25px 23px;
}
.hac-category-label,
.hac-card-label{
    display:block;
    margin-bottom:10px;
    color:var(--hac-gold-dark);
    font-size:9px;
    line-height:1.2;
    font-weight:800;
    letter-spacing:1.6px;
    text-transform:uppercase;
}
.hac-category-content h3{
    margin:0 0 10px;
    color:var(--hac-navy);
    font-size:21px;
    line-height:1.25;
    font-weight:800;
    transition:color .2s ease;
}
.hac-category-card:hover h3{color:var(--hac-gold-dark)}
.hac-category-content p{
    margin:0;
    color:var(--hac-muted);
    font-size:14px;
    line-height:1.68;
}
.hac-category-bottom{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:14px;
    margin-top:auto;
    padding-top:22px;
    color:#707982;
    font-size:11px;
    line-height:1.2;
    font-weight:700;
}
.hac-category-arrow,
.hac-card-arrow{
    display:flex;
    align-items:center;
    justify-content:center;
    width:34px;
    height:34px;
    flex:0 0 34px;
    border:1px solid #cbd0d2;
    border-radius:50%;
    color:var(--hac-navy);
    font-size:16px;
    transition:all .22s ease;
}
.hac-category-card:hover .hac-category-arrow{
    border-color:var(--hac-gold);
    background:var(--hac-gold);
    transform:translate(2px,-2px);
}

/* ---------------------------------------------------------
   CONTENT LISTING
--------------------------------------------------------- */

.hac-listing{
    position:relative;
    padding:92px 0 105px;
    background:
        linear-gradient(180deg,#f5f6f6,#eef0f1);
}
.hac-listing::before{
    content:"";
    position:absolute;
    inset:0;
    opacity:.4;
    background-image:
        linear-gradient(rgba(13,27,46,.035) 1px,transparent 1px),
        linear-gradient(90deg,rgba(13,27,46,.035) 1px,transparent 1px);
    background-size:56px 56px;
    pointer-events:none;
}
.hac-listing .hac-container{position:relative;z-index:1}

.hac-grid{
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:26px;
}

.hac-card{
    position:relative;
    min-width:0;
    overflow:hidden;
    border:1px solid #d2d6d8;
    background:#fff;
    box-shadow:0 8px 24px rgba(13,27,46,.055);
    transition:transform .24s ease,box-shadow .24s ease,border-color .24s ease;
}
.hac-card::before{
    content:"";
    position:absolute;
    top:0;
    left:0;
    width:52px;
    height:4px;
    z-index:4;
    background:var(--hac-gold);
    transition:width .25s ease;
}
.hac-card:hover{
    transform:translateY(-6px);
    border-color:#b8bdc0;
    box-shadow:0 22px 44px rgba(13,27,46,.12);
}
.hac-card:hover::before{width:100%}
.hac-card-link{
    display:flex;
    flex-direction:column;
    height:100%;
    color:inherit;
}
.hac-card-link:focus-visible,
.hac-category-link:focus-visible{
    outline:2px solid var(--hac-gold);
    outline-offset:4px;
}
.hac-card-image{
    aspect-ratio:16/10;
    overflow:hidden;
    background:var(--hac-navy);
    border-bottom:1px solid #dfe2e3;
}
.hac-card-image img{
    display:block;
    width:100%!important;
    height:100%!important;
    max-width:none!important;
    object-fit:cover!important;
    transition:transform .5s ease;
}
.hac-card:hover .hac-card-image img{transform:scale(1.045)}
.hac-card-content{
    position:relative;
    display:flex;
    flex:1;
    flex-direction:column;
    padding:23px 24px 24px;
}
.hac-card-top{
    display:flex;
    align-items:flex-start;
    justify-content:space-between;
    gap:14px;
    margin-bottom:12px;
}
.hac-card-label{margin:0}
.hac-card-index{
    flex:0 0 auto;
    color:rgba(13,27,46,.13);
    font-size:25px;
    line-height:1;
    font-weight:800;
    letter-spacing:-1.5px;
}
.hac-card h3{
    margin:0;
    padding-right:12px;
    color:var(--hac-navy);
    font-size:20px;
    line-height:1.3;
    font-weight:800;
    transition:color .2s ease;
}
.hac-card:hover h3{color:var(--hac-gold-dark)}
.hac-card p{
    margin:11px 0 0;
    color:var(--hac-muted);
    font-size:14px;
    line-height:1.68;
}
.hac-card-arrow{
    margin-top:22px;
    margin-left:auto;
}
.hac-card:hover .hac-card-arrow{
    border-color:var(--hac-gold);
    background:var(--hac-gold);
    transform:translate(2px,-2px);
}

.hac-grid-list{grid-template-columns:1fr}
.hac-grid-list .hac-card-link{display:grid;grid-template-columns:minmax(240px,31%) 1fr}
.hac-grid-list .hac-card-image{height:100%;aspect-ratio:auto;border:0}
.hac-grid-list .hac-card-content{min-height:205px}
.hac-grid-list .hac-card-arrow{margin-top:auto}

.hac-empty{
    grid-column:1/-1;
    padding:55px 30px;
    border:1px dashed #bdc3c6;
    background:rgba(255,255,255,.78);
    text-align:center;
}
.hac-empty p{margin:0;color:var(--hac-muted);font-size:15px;line-height:1.7}

.hac-pagination{
    display:flex;
    justify-content:center;
    margin-top:45px;
}
.hac-pagination .page-numbers{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    min-width:40px;
    height:40px;
    margin:0 3px;
    border:1px solid #cbd0d2;
    background:#fff;
    color:var(--hac-navy);
    font-size:13px;
    font-weight:700;
    transition:all .18s ease;
}
.hac-pagination .page-numbers:hover{
    border-color:var(--hac-gold);
    color:var(--hac-gold-dark);
}
.hac-pagination .current{
    border-color:var(--hac-navy)!important;
    background:var(--hac-navy)!important;
    color:#fff!important;
}

/* ---------------------------------------------------------
   RESPONSIVE
--------------------------------------------------------- */

@media(max-width:1050px){
    .hac-hero-grid{grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:42px}
    .hac-hero h1{font-size:clamp(42px,5.3vw,58px)}
    .hac-pillars{grid-template-columns:repeat(2,1fr)}
    .hac-pillar:nth-child(2){border-right:0}
    .hac-pillar:nth-child(-n+2){border-bottom:1px solid var(--hac-gray-300)}
    .hac-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
    .hac-category-grid-4,
    .hac-category-grid-3{grid-template-columns:repeat(2,minmax(0,1fr))}
}

@media(max-width:760px){
    .hac-container{width:min(100% - 32px,1180px)}
    .hac-hero{
        padding:58px 0 66px;
        background:linear-gradient(180deg,#f2f4f4,#eef0f1);
    }
    .hac-hero-grid{grid-template-columns:1fr;gap:38px}
    .hac-hero-content{padding:0 0 0 4px}
    .hac-hero-content::before{left:-12px}
    .hac-hero h1{max-width:720px;font-size:clamp(40px,9vw,58px);letter-spacing:-1.8px}
    .hac-hero p{font-size:16px}
    .hac-hero-visual{aspect-ratio:16/11;padding:14px 14px 14px 0}
    .hac-hero-image-count{top:17px;right:17px}
    .hac-directory,.hac-intro,.hac-listing{padding:68px 0 76px}
}

@media(max-width:600px){
    .hac-container{width:calc(100% - 28px)}
    .hac-hero{padding:46px 0 52px}
    .hac-hero-grid{gap:30px}
    .hac-label,.hac-kicker{font-size:9px;letter-spacing:1.8px}
    .hac-hero h1{font-size:39px;line-height:1.02}
    .hac-hero p{font-size:15px;line-height:1.7}
    .hac-hero-visual{aspect-ratio:4/3;padding:10px 10px 10px 0}
    .hac-hero-visual::after{height:20%;width:68%}
    .hac-hero-image-tag{left:17px;bottom:17px}
    .hac-hero-image-count{top:14px;right:14px;min-width:44px;height:44px}
    .hac-heading{margin-bottom:30px}
    .hac-heading h2{font-size:29px;letter-spacing:-.8px}
    .hac-heading p{font-size:15px}
    .hac-pillars{grid-template-columns:1fr}
    .hac-pillar,
    .hac-pillar:nth-child(2){min-height:0;border-right:0;border-bottom:1px solid var(--hac-gray-300)}
    .hac-pillar:last-child{border-bottom:0}
    .hac-category-grid-2,
    .hac-category-grid-3,
    .hac-category-grid-4,
    .hac-grid{grid-template-columns:1fr}
    .hac-category-content{padding:21px 20px}
    .hac-category-content h3{font-size:19px}
    .hac-card-content{padding:21px 20px}
    .hac-card h3{font-size:19px}
    .hac-grid-list .hac-card-link{display:flex}
    .hac-grid-list .hac-card-image{height:auto;aspect-ratio:16/10}
    .hac-note{padding:18px 19px}
}

/* Prevent common theme rules from introducing image gaps. */
.hac-archive .hac-hero-visual img,
.hac-archive .hac-card-image img,
.hac-archive .hac-category-media img{
    margin:0!important;
    padding:0!important;
    border:0!important;
    vertical-align:middle!important;
}
