/*
Theme Name: Seasons Holdings
Author: Seasons Holdings
Description: Custom theme for Seasons Holdings — diversified African enterprise group.
Version: 1.0
*/

/* ==========================================================================
   SEASONS HOLDINGS — shared design system
   Extends the seasons-redesign.html concept across a full multi-page site.
   ========================================================================== */

:root{
  --cream:#F6EFE1;
  --paper:#FFFDF8;
  --ink:#241F16;
  --ink-soft:#4A4234;
  --gold:#B98A3D;
  --gold-deep:#8C6425;
  --green:#33503E;
  --green-soft:#4E6F5A;
  --clay:#9C5A3C;
  --line: rgba(36,31,22,0.14);
}
*{box-sizing:border-box; margin:0; padding:0;}
html{scroll-behavior:smooth; overflow-x:hidden;}
body{
  background:var(--cream);
  color:var(--ink);
  font-family:'Work Sans', sans-serif;
  font-weight:400;
  line-height:1.6;
  -webkit-font-smoothing:antialiased;
  overflow-x:hidden;
}
h1,h2,h3{
  font-family:'Fraunces', serif;
  font-weight:500;
  letter-spacing:-0.01em;
  color:var(--ink);
}
.eyebrow{
  font-family:'IBM Plex Mono', monospace;
  font-size:0.72rem;
  letter-spacing:0.14em;
  text-transform:uppercase;
  color:var(--gold-deep);
}
a{color:inherit; text-decoration:none;}
.wrap{max-width:1120px; margin:0 auto; padding:0 32px;}
img{max-width:100%; display:block;}
button{font-family:'Work Sans', sans-serif;}

/* ---------- NAV ---------- */
nav{
  position:sticky; top:0; z-index:100;
  background:rgba(246,239,225,0.92);
  backdrop-filter:blur(6px);
  border-bottom:1px solid var(--line);
}
nav .wrap{display:flex; align-items:center; justify-content:space-between; height:80px; max-width:1400px; padding:0 40px; gap:28px;}
.brand{font-family:'Fraunces', serif; font-size:1.35rem; font-weight:600; letter-spacing:0.02em; display:flex; align-items:center; gap:10px; flex-shrink:0;}
.brand span{color:var(--gold-deep); font-style:italic; font-weight:400;}
.brand-logo{height:20px; width:auto; display:block; flex-shrink:0;}
.brand-mark{width:30px; height:30px; border-radius:50%; overflow:hidden; flex-shrink:0; border:1px solid var(--line); background:var(--paper);}
.brand-mark img{width:100%; height:100%; object-fit:contain;}

.nav-links{display:flex; align-items:center; justify-content:center; flex:1; min-width:0; gap:26px; font-size:0.85rem; flex-wrap:nowrap;}
.nav-links > li{position:relative; list-style:none; flex-shrink:0; white-space:nowrap;}
.nav-links a.top-link{position:relative; padding-bottom:4px; display:inline-block; white-space:nowrap;}
.nav-links a.top-link::after{
  content:""; position:absolute; left:0; bottom:0; width:0; height:1px;
  background:var(--gold-deep); transition:width .25s ease;
}
.nav-links li.has-dropdown{display:flex; align-items:center; white-space:nowrap;}
.nav-links a.top-link:hover::after,
.nav-links li.has-dropdown:hover a.top-link::after{width:100%;}
.nav-cta{
  border:1px solid var(--ink); padding:9px 20px; border-radius:999px; font-size:0.85rem;
  transition:all .2s ease; white-space:nowrap; flex-shrink:0;
}
.nav-cta:hover{background:var(--ink); color:var(--paper);}
.menu-toggle{
  display:none; font-family:'IBM Plex Mono'; font-size:0.8rem; border:1px solid var(--ink);
  border-radius:999px; padding:8px 14px; background:none; cursor:pointer; color:var(--ink);
}

/* dropdown (Our Companies) */
.has-dropdown{display:flex; align-items:center; gap:4px;}
.caret{font-size:0.65em; transition:transform .2s ease;}
.has-dropdown:hover .caret{transform:rotate(180deg);}
.dropdown{
  position:absolute; top:100%; left:50%; transform:translateX(-50%);
  padding-top:14px; /* invisible bridge — keeps hover contiguous from link to menu */
  min-width:620px; opacity:0; visibility:hidden; pointer-events:none;
  transition:opacity .2s ease;
}
.has-dropdown:hover .dropdown,
.has-dropdown.open .dropdown{opacity:1; visibility:visible; pointer-events:auto;}
.dropdown-panel{
  background:var(--paper); border:1px solid var(--line); border-radius:8px;
  box-shadow:0 18px 40px rgba(36,31,22,0.14);
  padding:22px; display:grid; grid-template-columns:repeat(3,1fr); gap:0;
  transform:translateY(8px); transition:transform .2s ease;
}
.has-dropdown:hover .dropdown-panel,
.has-dropdown.open .dropdown-panel{transform:translateY(0);}
.dropdown-col{padding:0 18px; border-left:1px solid var(--line);}
.dropdown-col:first-child{border-left:none;}
.dropdown-col .dd-head{display:block; font-family:'Fraunces', serif; font-style:italic; font-size:1.05rem; color:var(--ink); margin-bottom:12px;}
.dropdown-col .dd-head:hover{color:var(--gold-deep);}
.dropdown-col ul{list-style:none;}
.dropdown-col li{margin-bottom:9px;}
.dropdown-col a{font-size:0.85rem; color:var(--ink-soft);}
.dropdown-col a:hover{color:var(--gold-deep);}

/* ---------- MOBILE MENU PANEL ---------- */
.mobile-panel{
  position:fixed; inset:80px 0 0 0; background:var(--cream); z-index:90;
  transform:translateX(100%); transition:transform .3s ease; overflow-y:auto;
  padding:20px 0 60px;
}
.mobile-panel.open{transform:translateX(0);}
.mobile-panel .wrap{display:flex; flex-direction:column; gap:2px;}
.mobile-panel a.m-link{
  font-size:1.05rem; padding:16px 0; border-bottom:1px solid var(--line); display:block;
}
.mobile-group{border-bottom:1px solid var(--line);}
.mobile-group-head{
  display:flex; justify-content:space-between; align-items:center; padding:16px 0;
  font-size:1.05rem; cursor:pointer;
}
.mobile-group-head .caret{transition:transform .2s ease;}
.mobile-group.open .mobile-group-head .caret{transform:rotate(180deg);}
.mobile-sub{max-height:0; overflow:hidden; transition:max-height .3s ease;}
.mobile-group.open .mobile-sub{max-height:900px;}
.mobile-sub-block{padding:6px 0 16px 12px;}
.mobile-sub-block .dd-head{display:block; font-family:'Fraunces', serif; font-style:italic; font-size:0.98rem; margin:12px 0 8px; color:var(--gold-deep);}
.mobile-sub-block a{display:block; font-size:0.92rem; color:var(--ink-soft); padding:6px 0;}
.mobile-panel .nav-cta{display:inline-block; margin-top:22px;}

/* ---------- HERO ---------- */
.hero{position:relative; padding:96px 0 60px; overflow:hidden;}
.hero .wrap{position:relative; z-index:2;}
.hero-arc{
  position:absolute; top:-220px; left:50%; transform:translateX(-50%);
  width:1400px; height:700px; border-radius:50%;
  background:radial-gradient(circle at 50% 100%, rgba(185,138,61,0.35), rgba(185,138,61,0) 65%);
  z-index:1; pointer-events:none;
}
.hero-eyebrow{margin-bottom:22px;}
.hero h1{
  font-size:clamp(2.2rem, 5.6vw, 4.4rem);
  max-width:17ch;
  line-height:1.06;
}
.hero h1 em{font-style:italic; color:var(--gold-deep); font-weight:400;}
.hero-sub{
  max-width:56ch; font-size:1.08rem; color:var(--ink-soft); margin:26px 0 34px;
}
.hero-actions{display:flex; gap:16px; flex-wrap:wrap;}
.btn-primary{
  background:var(--ink); color:var(--paper); padding:14px 28px; border-radius:999px;
  font-size:0.92rem; letter-spacing:0.01em; transition:background .2s ease; display:inline-block;
  border:none; cursor:pointer;
}
.btn-primary:hover{background:var(--green);}
.btn-ghost{
  border:1px solid var(--ink); padding:14px 28px; border-radius:999px; font-size:0.92rem;
  transition:all .2s ease; display:inline-block; background:none; cursor:pointer;
}
.btn-ghost:hover{border-color:var(--gold-deep); color:var(--gold-deep);}

/* small hero variant for interior pages */
.hero-small{padding:64px 0 46px;}
.hero-small h1{font-size:clamp(2rem, 4.4vw, 3.2rem); max-width:22ch;}
.breadcrumb{font-family:'IBM Plex Mono', monospace; font-size:0.75rem; letter-spacing:0.08em; color:var(--ink-soft); text-transform:uppercase; margin-bottom:18px;}
.breadcrumb a:hover{color:var(--gold-deep);}

.horizon{
  width:100%; height:64px; margin-top:60px;
  background:linear-gradient(90deg, var(--gold) 0%, var(--gold) 33%, var(--green-soft) 33%, var(--green-soft) 66%, var(--clay) 66%, var(--clay) 100%);
  opacity:0.9; border-radius:3px;
}
.horizon.thin{height:8px; margin-top:0;}

/* ---------- SECTION GENERIC ---------- */
section{padding:88px 0;}
.section-head{max-width:680px; margin-bottom:56px;}
.section-head.center{margin-left:auto; margin-right:auto; text-align:center;}
.section-head .eyebrow{margin-bottom:14px;}
.section-head h2{font-size:clamp(1.8rem, 3.4vw, 2.6rem); line-height:1.15;}
.section-head p{color:var(--ink-soft); margin-top:18px; max-width:64ch;}
.section-head.center p{margin-left:auto; margin-right:auto;}

.reveal{opacity:0; transform:translateY(18px); transition:opacity .7s ease, transform .7s ease;}
.reveal.in{opacity:1; transform:none;}

/* ---------- ABOUT / TWO-COL ---------- */
.about{background:var(--paper); border-top:1px solid var(--line); border-bottom:1px solid var(--line);}
.about-grid{display:grid; grid-template-columns:1.1fr 0.9fr; gap:72px; align-items:start;}
.about p{color:var(--ink-soft); margin-bottom:18px; max-width:60ch;}
.about-figures{display:flex; flex-direction:column; gap:0;}
.figure-row{display:flex; justify-content:space-between; gap:20px; padding:22px 0; border-bottom:1px solid var(--line);}
.figure-row:first-child{padding-top:0;}
.figure-num{font-family:'Fraunces', serif; font-size:2.2rem; color:var(--gold-deep); flex-shrink:0;}
.figure-label{font-size:0.85rem; color:var(--ink-soft); max-width:24ch; text-align:right;}

/* ---------- CARD GRIDS (services / practice areas / etc.) ---------- */
.card-grid{display:grid; gap:2px; background:var(--line); border:1px solid var(--line); border-radius:4px; overflow:hidden;}
.card-grid.cols-2{grid-template-columns:repeat(2, 1fr);}
.card-grid.cols-3{grid-template-columns:repeat(3, 1fr);}
.card-grid.cols-4{grid-template-columns:repeat(4, 1fr);}
.plain-card{background:var(--cream); padding:40px 32px; position:relative;}
.plain-card::before{content:""; position:absolute; top:0; left:0; width:100%; height:4px; background:var(--gold);}
.plain-card:nth-child(3n+2)::before{background:var(--green-soft);}
.plain-card:nth-child(3n+3)::before{background:var(--clay);}
.plain-card .eyebrow{margin-bottom:16px;}
.plain-card h3{font-size:1.25rem; margin-bottom:14px;}
.plain-card p{color:var(--ink-soft); font-size:0.95rem;}
.item-list{list-style:none; font-size:0.88rem; color:var(--ink-soft); margin-top:16px;}
.item-list li{padding:6px 0; border-top:1px solid var(--line);}
.item-list li:first-child{border-top:none;}

/* number badge for process steps */
.step-num{
  font-family:'Fraunces', serif; font-style:italic; font-size:1.1rem; color:var(--gold);
  display:inline-block; margin-bottom:10px;
}

/* ---------- DARK / INVERTED SECTION ---------- */
.dark-section{background:var(--ink); color:var(--paper);}
.dark-section .section-head h2{color:var(--paper);}
.dark-section .eyebrow{color:var(--gold);}
.dark-section p{color:rgba(255,253,248,0.75);}

/* ---------- OUR COMPANIES CARDS (image/logo crossfade) ---------- */
.company-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:1px; background:rgba(255,253,248,0.14); border:1px solid rgba(255,253,248,0.14);}
.company-grid.light{background:var(--line); border-color:var(--line);}
.company-card{background:var(--ink); display:flex; flex-direction:column;}
.company-grid.light .company-card{background:var(--paper);}
.company-media{position:relative; aspect-ratio:4/3; overflow:hidden; background:var(--cream);}
.company-media .layer{position:absolute; inset:0; opacity:1; transition:opacity .5s ease;}
.company-media .layer.logo-layer{opacity:0; display:flex; align-items:center; justify-content:center; background:var(--paper); padding:30px;}
.company-media .layer.logo-layer img{max-height:100%; width:auto; object-fit:contain;}
.company-card:hover .layer.photo-layer,
.company-card.active .layer.photo-layer{opacity:0;}
.company-card:hover .layer.logo-layer,
.company-card.active .layer.logo-layer{opacity:1;}
.placeholder-art{width:100%; height:100%; display:flex; align-items:center; justify-content:center; position:relative; overflow:hidden;}
.placeholder-art svg{width:100%; height:100%;}
.company-body{padding:32px 30px 36px; flex:1; display:flex; flex-direction:column;}
.company-tag{font-size:0.78rem; color:var(--gold); font-family:'IBM Plex Mono', monospace; letter-spacing:0.05em; margin-bottom:14px; text-transform:uppercase;}
.company-grid.light .company-tag{color:var(--gold-deep);}
.company-card h3{font-size:1.3rem; margin-bottom:12px; color:var(--paper);}
.company-grid.light .company-card h3{color:var(--ink);}
.company-card p{font-size:0.9rem; color:rgba(255,253,248,0.72); margin-bottom:20px; flex:1;}
.company-grid.light .company-card p{color:var(--ink-soft);}
.learn-more{font-size:0.88rem; font-weight:500; display:inline-flex; align-items:center; gap:6px; color:var(--gold);}
.company-grid.light .learn-more{color:var(--gold-deep);}
.learn-more .arrow{transition:transform .2s ease;}
.learn-more:hover .arrow{transform:translateX(4px);}

/* ---------- SUBSIDIARY SUB-NAV CARDS (About/Programmes/etc within a company landing) ---------- */
.subnav-grid{display:grid; grid-template-columns:repeat(auto-fit, minmax(220px,1fr)); gap:2px; background:var(--line); border:1px solid var(--line); border-radius:4px; overflow:hidden;}
.subnav-card{background:var(--paper); padding:30px 26px; transition:background .2s ease;}
.subnav-card:hover{background:var(--cream);}
.subnav-card .eyebrow{margin-bottom:10px;}
.subnav-card h3{font-size:1.1rem; margin-bottom:8px;}
.subnav-card p{font-size:0.85rem; color:var(--ink-soft); margin-bottom:14px;}

/* ---------- QUOTES ---------- */
.feedback-grid{display:grid; grid-template-columns:1fr 1fr; gap:40px;}
.quote{background:var(--paper); border:1px solid var(--line); border-radius:4px; padding:36px; position:relative;}
.quote-mark{font-family:'Fraunces', serif; font-size:3rem; color:var(--gold); line-height:1; margin-bottom:10px; display:block;}
.quote p{font-family:'Fraunces', serif; font-size:1.1rem; font-style:italic; font-weight:400; color:var(--ink); margin-bottom:20px;}
.quote-name{font-family:'IBM Plex Mono', monospace; font-size:0.78rem; color:var(--ink-soft); text-transform:uppercase; letter-spacing:0.06em;}

/* ---------- LIST ROWS (industries, sectors, distribution channels) ---------- */
.row-list{border-top:1px solid var(--line);}
.row-item{display:flex; justify-content:space-between; align-items:center; gap:20px; padding:22px 0; border-bottom:1px solid var(--line);}
.row-item .row-num{font-family:'IBM Plex Mono', monospace; font-size:0.78rem; color:var(--gold-deep); min-width:36px;}
.row-item .row-title{font-family:'Fraunces', serif; font-size:1.1rem; flex:1;}
.row-item .row-desc{color:var(--ink-soft); font-size:0.88rem; max-width:42ch; text-align:right;}

/* ---------- STAT COUNTERS ---------- */
.stat-grid{display:grid; grid-template-columns:repeat(auto-fit, minmax(150px,1fr)); gap:2px; background:var(--line); border:1px solid var(--line); border-radius:4px; overflow:hidden;}
.stat-cell{background:var(--paper); padding:34px 24px; text-align:center;}
.stat-num{font-family:'Fraunces', serif; font-size:2.4rem; color:var(--gold-deep);}
.stat-label{font-size:0.8rem; color:var(--ink-soft); margin-top:8px;}
.dark-section .stat-cell{background:#332c1e;}
.dark-section .stat-num{color:var(--gold);}
.dark-section .stat-label{color:rgba(255,253,248,0.7);}

/* ---------- BIO / TEAM GRID ---------- */
.bio-grid{display:grid; grid-template-columns:repeat(auto-fit, minmax(240px,1fr)); gap:36px;}
.bio-card{background:var(--paper); border:1px solid var(--line); border-radius:4px; overflow:hidden;}
.bio-photo{aspect-ratio:1; background:var(--cream); position:relative; overflow:hidden;}
.bio-info{padding:22px 24px 26px;}
.bio-info .name{font-family:'Fraunces', serif; font-size:1.15rem; margin-bottom:4px;}
.bio-info .title{font-size:0.8rem; color:var(--gold-deep); font-family:'IBM Plex Mono', monospace; letter-spacing:0.04em; text-transform:uppercase; margin-bottom:12px;}
.bio-info p{font-size:0.88rem; color:var(--ink-soft);}

/* ---------- NEWS / PRESS CARDS ---------- */
.news-grid{display:grid; grid-template-columns:repeat(auto-fit, minmax(300px,1fr)); gap:2px; background:var(--line); border:1px solid var(--line); border-radius:4px; overflow:hidden;}
.news-card{background:var(--paper); display:flex; flex-direction:column;}
.news-thumb{aspect-ratio:16/10; background:var(--cream); position:relative; overflow:hidden;}
.news-body{padding:26px 26px 30px; flex:1; display:flex; flex-direction:column;}
.news-date{font-family:'IBM Plex Mono', monospace; font-size:0.72rem; color:var(--gold-deep); letter-spacing:0.06em; text-transform:uppercase; margin-bottom:12px;}
.news-body h3{font-size:1.1rem; margin-bottom:10px; line-height:1.3;}
.news-body p{font-size:0.88rem; color:var(--ink-soft); margin-bottom:18px; flex:1;}

/* ---------- GALLERY ---------- */
.gallery-grid{display:grid; grid-template-columns:repeat(3, 1fr); gap:6px;}
.gallery-item{aspect-ratio:1; position:relative; overflow:hidden; cursor:pointer;}
.gallery-item .placeholder-art{transition:transform .4s ease;}
.gallery-item:hover .placeholder-art{transform:scale(1.06);}
.gallery-item.tall{grid-row:span 2;}
.lightbox{
  position:fixed; inset:0; background:rgba(36,31,22,0.92); z-index:200; display:none;
  align-items:center; justify-content:center; padding:40px;
}
.lightbox.open{display:flex;}
.lightbox-inner{max-width:800px; width:100%; background:var(--paper); border-radius:6px; overflow:hidden;}
.lightbox-inner .placeholder-art{aspect-ratio:4/3;}
.lightbox-caption{padding:22px 26px; font-size:0.9rem; color:var(--ink-soft);}
.lightbox-close{position:absolute; top:26px; right:32px; color:var(--paper); font-size:1.6rem; cursor:pointer; background:none; border:none;}

/* ---------- FORMS (Contact, Careers apply, Newsletter) ---------- */
.form-grid{display:grid; grid-template-columns:1fr 1fr; gap:18px;}
.form-field{display:flex; flex-direction:column; gap:8px; margin-bottom:18px;}
.form-field.full{grid-column:1/-1;}
.form-field label{font-family:'IBM Plex Mono', monospace; font-size:0.72rem; letter-spacing:0.06em; text-transform:uppercase; color:var(--ink-soft);}
.form-field input, .form-field textarea, .form-field select{
  border:1px solid var(--line); background:var(--paper); padding:13px 16px; border-radius:4px;
  font-family:'Work Sans'; font-size:0.95rem; color:var(--ink); outline:none; transition:border-color .2s ease;
}
.form-field input:focus, .form-field textarea:focus, .form-field select:focus{border-color:var(--gold-deep);}
.form-field textarea{resize:vertical; min-height:120px;}
.contact{background:var(--paper); border-top:1px solid var(--line);}
.contact-grid{display:grid; grid-template-columns:1fr 1fr; gap:72px; align-items:start;}
.contact-line{display:flex; justify-content:space-between; padding:18px 0; border-bottom:1px solid var(--line); font-size:0.98rem;}
.contact-line span:first-child{color:var(--ink-soft); font-size:0.85rem; font-family:'IBM Plex Mono', monospace; text-transform:uppercase; letter-spacing:0.08em;}
.newsletter{background:var(--cream); border:1px solid var(--line); border-radius:6px; padding:36px;}
.newsletter h3{font-size:1.3rem; margin-bottom:10px;}
.newsletter p{color:var(--ink-soft); font-size:0.9rem; margin-bottom:22px;}
.nl-form{display:flex; gap:0; border:1px solid var(--ink); border-radius:999px; overflow:hidden;}
.nl-form input{flex:1; border:none; background:none; padding:14px 20px; font-family:'Work Sans'; font-size:0.9rem; outline:none;}
.nl-form button{background:var(--ink); color:var(--paper); border:none; padding:14px 24px; font-size:0.9rem; cursor:pointer;}
.form-success{display:none; background:var(--paper); border:1px solid var(--green-soft); border-radius:4px; padding:18px 22px; font-size:0.9rem; color:var(--green); margin-top:16px;}
.form-success.show{display:block;}
.map-block{aspect-ratio:16/9; border-radius:6px; overflow:hidden; border:1px solid var(--line); margin-top:32px;}

/* ---------- CAREERS ---------- */
.role-list{border-top:1px solid var(--line);}
.role-item{display:flex; justify-content:space-between; align-items:center; gap:20px; padding:26px 0; border-bottom:1px solid var(--line); flex-wrap:wrap;}
.role-info h3{font-size:1.1rem; margin-bottom:6px;}
.role-info .role-meta{font-size:0.8rem; color:var(--ink-soft); font-family:'IBM Plex Mono', monospace; letter-spacing:0.04em;}
.empty-state{text-align:center; padding:60px 20px; border:1px dashed var(--line); border-radius:6px; background:var(--paper);}
.empty-state h3{font-size:1.3rem; margin-bottom:12px;}
.empty-state p{color:var(--ink-soft); max-width:48ch; margin:0 auto;}

/* ---------- PARTNER LOGO STRIP ---------- */
.partner-strip{display:grid; grid-template-columns:repeat(auto-fit, minmax(140px,1fr)); gap:1px; background:var(--line); border:1px solid var(--line);}
.partner-mark{background:var(--paper); aspect-ratio:2/1; display:flex; align-items:center; justify-content:center; color:var(--ink-soft); font-family:'IBM Plex Mono', monospace; font-size:0.75rem; letter-spacing:0.04em; text-transform:uppercase; text-align:center; padding:10px;}

/* ---------- FOOTER ---------- */
footer{background:var(--ink); color:rgba(255,253,248,0.75); padding:64px 0 28px;}
.footer-grid{display:grid; grid-template-columns:1.4fr 1fr 1fr 1fr; gap:40px; padding-bottom:44px; border-bottom:1px solid rgba(255,253,248,0.14);}
.footer-brand{margin-bottom:18px;}
.footer-brand em{color:var(--gold); font-style:italic;}
.footer-logo{
  display:inline-flex; align-items:center; margin-bottom:4px;
}
.footer-logo img{height:20px; width:auto; display:block;}
footer h4{font-family:'IBM Plex Mono', monospace; font-size:0.75rem; text-transform:uppercase; letter-spacing:0.1em; color:var(--gold); margin-bottom:18px;}
footer ul{list-style:none;}
footer li{margin-bottom:10px; font-size:0.92rem;}
footer li a:hover{color:var(--paper);}
.footer-bottom{display:flex; justify-content:space-between; padding-top:24px; font-size:0.8rem; color:rgba(255,253,248,0.5); flex-wrap:wrap; gap:10px;}

/* ---------- UTILITIES ---------- */
.mt-0{margin-top:0 !important;}
.text-center{text-align:center;}
.tag-row{display:flex; flex-wrap:wrap; gap:10px; margin-top:20px;}
.tag-pill{border:1px solid var(--line); border-radius:999px; padding:8px 16px; font-size:0.8rem; color:var(--ink-soft); font-family:'IBM Plex Mono', monospace;}

@media (max-width: 1200px){
  .nav-links{display:none;}
  .menu-toggle{display:inline-block;}
}
@media (max-width: 640px){
  .nav-cta{display:none;}
  .brand-logo{height:18px;}
  nav .wrap{padding:0 20px;}
}
@media (max-width: 860px){
  .about-grid, .contact-grid, .form-grid{grid-template-columns:1fr; gap:32px;}
  .card-grid.cols-2, .card-grid.cols-3, .card-grid.cols-4,
  .company-grid, .news-grid{grid-template-columns:1fr;}
  .feedback-grid{grid-template-columns:1fr;}
  .footer-grid{grid-template-columns:1fr; gap:32px;}
  .figure-label{text-align:left;}
  .row-item{flex-direction:column; align-items:flex-start; gap:8px;}
  .row-item .row-desc{text-align:left; max-width:none;}
  .gallery-grid{grid-template-columns:repeat(2,1fr);}
  section{padding:64px 0;}
  .hero{padding:56px 0 40px;}
}

/* ==========================================================================
   HOMEPAGE REDESIGN — scoped, additive classes only.
   Nothing below touches .hero-small, .about, .contact, .plain-card, .stat-grid,
   .row-list/.row-item or any other class shared with interior pages —
   those stay exactly as they were. Everything here is new/homepage-only.
   ========================================================================== */

/* ---------- HERO: full-bleed photo with overlay ---------- */
.hero.hero-media{
  min-height:640px; display:flex; align-items:center;
  padding:150px 0 100px; overflow:hidden;
}
.hero-photo{
  position:absolute; inset:0; z-index:0;
  /* TODO: once a photo is supplied, add: background-image:url('...'); background-size:cover; background-position:center; */
  background:
    radial-gradient(circle at 15% 20%, rgba(185,138,61,0.45), transparent 45%),
    radial-gradient(circle at 85% 75%, rgba(78,111,90,0.4), transparent 50%),
    linear-gradient(135deg, var(--clay) 0%, var(--ink) 75%);
  background-size:cover; background-position:center;
}
.hero-photo::after{
  content:""; position:absolute; inset:0;
  background:linear-gradient(90deg, rgba(36,31,22,0.82) 0%, rgba(36,31,22,0.55) 45%, rgba(36,31,22,0.25) 100%);
}
.hero.hero-media .hero-eyebrow{color:var(--gold);}
.hero.hero-media h1{color:var(--paper);}
.hero.hero-media h1 em{color:var(--gold);}
.hero.hero-media .hero-tagline{color:rgba(255,253,248,0.92);}
.hero.hero-media .hero-sub{color:rgba(255,253,248,0.78); max-width:46ch;}
.hero.hero-media .btn-ghost{border-color:rgba(255,253,248,0.6); color:var(--paper);}
.hero.hero-media .btn-ghost:hover{border-color:var(--gold); color:var(--gold);}

@keyframes heroFadeUp{ from{opacity:0; transform:translateY(22px);} to{opacity:1; transform:none;} }
.hero-animate{opacity:0; animation:heroFadeUp .8s ease forwards;}
.hero-animate.d1{animation-delay:.05s;}
.hero-animate.d2{animation-delay:.18s;}
.hero-animate.d3{animation-delay:.32s;}
.hero-animate.d4{animation-delay:.46s;}

/* ---------- WHO WE ARE: image collage + animated counters ---------- */
.who-grid{display:grid; grid-template-columns:1.05fr 0.95fr; gap:72px; align-items:center;}
.who-media{position:relative; padding-bottom:34px;}
.who-photo-a, .who-photo-b{
  border-radius:6px; overflow:hidden; background:var(--cream); border:1px solid var(--line);
}
.who-photo-a{aspect-ratio:4/3; position:relative; z-index:1;}
.who-photo-b{
  aspect-ratio:1; width:46%; position:absolute; right:-6%; bottom:-34px; z-index:2;
  box-shadow:0 18px 40px rgba(36,31,22,0.28); border:4px solid var(--paper);
}
.who-photo-a img, .who-photo-b img{
  width:100%; height:100%; object-fit:cover; display:block; transition:transform .6s ease;
}
.who-photo-a:hover img, .who-photo-b:hover img{transform:scale(1.06);}
.img-slot{
  width:100%; height:100%; display:flex; align-items:center; justify-content:center; text-align:center;
  background:linear-gradient(135deg, var(--cream), #ece2ce); color:var(--ink-soft);
  font-family:'IBM Plex Mono', monospace; font-size:0.72rem; letter-spacing:0.04em; padding:14px;
  text-transform:uppercase;
}

.who-stats{display:grid; grid-template-columns:repeat(3,1fr); gap:2px; background:var(--line); border:1px solid var(--line); border-radius:4px; overflow:hidden; margin-top:56px;}
.who-stats .stat-cell{background:var(--paper);}
.counter{font-family:'Fraunces', serif; font-size:2.2rem; color:var(--gold-deep);}

/* ---------- OUR PHILOSOPHIES: icon cards ---------- */
.icon-card-grid{display:grid; grid-template-columns:repeat(4,1fr); gap:22px;}
.icon-card{
  background:var(--cream); border-radius:8px; padding:36px 28px; position:relative;
  border:1px solid var(--line); transition:transform .3s ease, box-shadow .3s ease, border-color .3s ease;
}
.icon-card:hover{transform:translateY(-8px); box-shadow:0 18px 34px rgba(36,31,22,0.12); border-color:transparent;}
.icon-badge{
  width:56px; height:56px; border-radius:50%; display:flex; align-items:center; justify-content:center;
  margin-bottom:22px; color:var(--paper);
}
.icon-badge svg{width:28px; height:28px;}
.icon-card:nth-child(1) .icon-badge{background:var(--gold-deep);}
.icon-card:nth-child(2) .icon-badge{background:var(--green-soft);}
.icon-card:nth-child(3) .icon-badge{background:var(--clay);}
.icon-card:nth-child(4) .icon-badge{background:var(--ink);}
.icon-card h3{font-size:1.12rem; margin-bottom:12px;}
.icon-card p{color:var(--ink-soft); font-size:0.92rem;}

/* ---------- WHERE WE OPERATE: sector photo tiles ---------- */
.sector-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:18px;}
.sector-tile{
  position:relative; border-radius:8px; overflow:hidden; aspect-ratio:4/5;
  background:var(--cream); border:1px solid var(--line);
}
.sector-tile:nth-child(4), .sector-tile:nth-child(5){grid-column:span 1;}
.sector-tile:nth-child(1){grid-column:span 2; aspect-ratio:8/5;}
.sector-media{position:absolute; inset:0;}
.sector-media img{width:100%; height:100%; object-fit:cover; display:block; transition:transform .6s ease;}
.sector-tile::after{
  content:""; position:absolute; inset:0;
  background:linear-gradient(180deg, rgba(36,31,22,0) 30%, rgba(36,31,22,0.88) 100%);
  transition:background .3s ease;
}
.sector-tile:hover .sector-media img{transform:scale(1.08);}
.sector-body{position:absolute; left:0; right:0; bottom:0; z-index:2; padding:22px 24px;}
.sector-num{font-family:'IBM Plex Mono', monospace; font-size:0.72rem; color:var(--gold); letter-spacing:0.08em; display:block; margin-bottom:6px;}
.sector-title{font-family:'Fraunces', serif; font-size:1.15rem; color:var(--paper); display:block; margin-bottom:8px;}
.sector-desc{
  color:rgba(255,253,248,0.82); font-size:0.82rem; max-width:34ch;
  max-height:0; opacity:0; overflow:hidden; transition:max-height .35s ease, opacity .35s ease;
}
.sector-tile:hover .sector-desc{max-height:120px; opacity:1;}

/* ---------- OUR COMPANIES: hover motion ---------- */
.company-card{transition:transform .3s ease, box-shadow .3s ease;}
.company-card:hover{transform:translateY(-8px); box-shadow:0 20px 38px rgba(36,31,22,0.18); z-index:2; position:relative;}
.company-card .company-media img{transition:transform .5s ease;}
.company-card:hover .company-media img{transform:scale(1.04);}
.company-card .learn-more{transition:gap .2s ease;}

/* ---------- OUR IMPACT: split with image ---------- */
.impact-split{display:grid; grid-template-columns:0.85fr 1.15fr; gap:64px; align-items:center;}
.impact-media{border-radius:8px; overflow:hidden; aspect-ratio:4/5; background:#332c1e;}
.impact-media img{width:100%; height:100%; object-fit:cover; display:block;}
.impact-content .stat-grid{margin-top:36px;}

/* ---------- PARTNER WITH US: banner CTA ---------- */
.contact-banner{
  position:relative; overflow:hidden;
  background:linear-gradient(120deg, var(--ink) 0%, #33291c 100%);
  border-top:none;
}
.contact-banner .banner-arc{
  position:absolute; top:-260px; right:-160px; width:900px; height:900px; border-radius:50%;
  background:radial-gradient(circle, rgba(185,138,61,0.28), transparent 65%); pointer-events:none;
}
.contact-banner .wrap{position:relative; z-index:2;}
.contact-banner .section-head{max-width:none; margin-bottom:0; display:grid; grid-template-columns:1.4fr 1fr; gap:56px; align-items:center;}
.contact-banner .eyebrow{color:var(--gold);}
.contact-banner h2{color:var(--paper);}
.contact-banner p{color:rgba(255,253,248,0.78);}
.contact-banner-actions{display:flex; flex-direction:column; gap:18px; align-items:flex-start;}
.contact-banner .btn-primary{background:var(--gold); color:var(--ink); font-weight:500;}
.contact-banner .btn-primary:hover{background:var(--gold-deep); color:var(--paper);}
.contact-banner-alt{font-size:0.9rem; color:rgba(255,253,248,0.72);}
.contact-banner-alt a{color:var(--gold); text-decoration:underline; text-underline-offset:3px;}

@media (max-width: 880px){
  .who-grid, .impact-split, .contact-banner .section-head{grid-template-columns:1fr;}
  .icon-card-grid{grid-template-columns:repeat(2,1fr);}
  .sector-grid{grid-template-columns:repeat(2,1fr);}
  .sector-tile:nth-child(1){grid-column:span 2;}
  .who-photo-b{width:52%; right:-4%; bottom:-24px;}
  .who-stats{grid-template-columns:repeat(2,1fr); margin-top:64px;}
  .contact-banner-actions{align-items:flex-start; margin-top:8px;}
  .hero.hero-media{min-height:0; padding:120px 0 70px;}
}
@media (max-width: 560px){
  .icon-card-grid, .sector-grid{grid-template-columns:1fr;}
  .sector-tile:nth-child(1){grid-column:span 1; aspect-ratio:4/5;}
  .who-stats{grid-template-columns:1fr;}
  .who-photo-b{width:58%; right:0; bottom:-18px;}
  .who-media{padding-bottom:24px;}
  .hero.hero-media{padding:100px 0 56px;}
  .contact-banner .btn-primary{width:100%; text-align:center;}
}