/* ============================================================
   BUSINESS . Corporates & Groups (business-enterprises.html) . 2026-10-20
   Ground truth: otabek 20.10/Business - Corporates & Groups/Spec+Html/digidoe-corporates-groups.html
                 + digidoe-corporates-groups-spec.md; the PDF is 1440 x 5356 pt (1 pt = 1 px).
   Figma "DD-Website" frame "Business - Corporates & Groups" (1186:7335).

   Same recipe as sept-sme.css: <main> IS the designer's markup (classes corp-*,
   qa/oracle/designer_to_main.py) and this is his stylesheet with the mechanical changes:
     .x                 -> [data-skin="corp"] #main .corp-x
     photos             -> his four data: jpgs as webp under sept/business-enterprises/ (md5-matched)
     body min-width     -> gone (D1): his numbers hold from 1300 up; the block at the end relaxes them below.
     nav + footer       -> his rules dropped, chrome stays live (D2): dd-nav.css + sept-footer.css
   Scope is data-skin (dd-shell.css keys 21 rules on [data-sept]). data-followup="biz" is OFF this page:
   followup.css forces h3 20px, every p #5C5750 and every non-.btn link #B75F00 with !important inside
   main, which beat his white hero paragraph and every button label. The two chrome blocks it also
   carried (black header CTAs, cookie Accept) are repeated below, keyed on data-skin.

   Deviations from his HTML, each on record:
     hero       live hero chips dropped (03.10 precedent, "use the designer's version"); his disclaimer
                line under the card is the live approved sentence.
     links      wired to the live targets by link text; the three "Explore ..." pills carry the live
                arrow (live copy wins, 15.10 precedent).
     onboarding the live button label "Speak to our team about your group" is longer than his; the pair
                spills past his 520px column on one line (Yuval 2026-10-20 "let it spill so it matches
                the designer notes").
     reveals    kept (D3): scroll-driven, same timing family as alt-home.css, defined at the end.
   ============================================================ */

html[data-skin="corp"] body{background:#fff}

/* ---------- resets his page relied on, scoped to main ---------- */
[data-skin="corp"] main{
  width:100%;overflow-x:clip;color:#121212;font-size:16px;line-height:normal;letter-spacing:0;
  font-family:"Inter",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;
  -webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;font-synthesis:none;
}
[data-skin="corp"] #main{
  --black:#121212;--grey-700:#555049;--grey-650:#5C5750;--grey-500:#7B756D;
  --beige:#F4F3F0;--border:#D6D2C7;--orange:#F37F00;--orange-dark:#B75F00;--white:#FFFFFF;
}
[data-skin="corp"] #main *{box-sizing:border-box;margin:0;padding:0}
[data-skin="corp"] #main a{color:inherit;text-decoration:none}
[data-skin="corp"] #main img,[data-skin="corp"] #main svg{display:block}
[data-skin="corp"] #main h1,[data-skin="corp"] #main h2,[data-skin="corp"] #main h3,[data-skin="corp"] #main p{max-width:none;letter-spacing:0;text-wrap:initial}

/* ---------- his page ---------- */
[data-skin="corp"] #main .corp-wrap{width:1440px;margin:0 auto;position:relative}
[data-skin="corp"] #main .corp-bleed-white{background:#FFFFFF;width:100%}
[data-skin="corp"] #main .corp-bleed-grey{background:#F4F3F0;width:100%}

/* Buttons */
[data-skin="corp"] #main .corp-btn{display:inline-flex;align-items:center;justify-content:center;height:47px;padding:14px 24px;border-radius:100px;font-size:16px;line-height:19px;white-space:nowrap;text-align:center;border:none;font-family:inherit;cursor:pointer;flex-shrink:0}
[data-skin="corp"] #main .corp-btn-dark{background:#121212;color:#FFFFFF;font-weight:700}
[data-skin="corp"] #main .corp-btn-white-primary{background:#FFFFFF;color:#121212;font-weight:700}
[data-skin="corp"] #main .corp-btn-light{background:#F4F3F0;color:#555049;font-weight:500}
[data-skin="corp"] #main .corp-btn-white{background:#FFFFFF;color:#555049;font-weight:500}
[data-skin="corp"] #main .corp-btn-trans{background:rgba(18,18,18,0.16);color:#FFFFFF;font-weight:500}

/* Type */
[data-skin="corp"] #main .corp-h44{font-size:44px;line-height:53px;font-weight:500;color:#121212}
[data-skin="corp"] #main .corp-p16{font-size:16px;line-height:24px;font-weight:400;color:#5C5750}

/* 2. Hero */
[data-skin="corp"] #main .corp-hero{display:flex;flex-direction:column;align-items:center;gap:20px;padding:0 80px;height:684px}
[data-skin="corp"] #main .corp-hero-card{width:1280px;height:640px;border-radius:48px;overflow:hidden;position:relative;display:flex;flex-direction:column;justify-content:center;align-items:flex-start;gap:40px;padding:80px;flex-shrink:0}
[data-skin="corp"] #main .corp-hero-bg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
[data-skin="corp"] #main .corp-hero-overlay{position:absolute;inset:0;border-radius:48px;background-size:100% 100%;background-image:url("data:image/svg+xml;utf8,<svg viewBox='0 0 1280 640' xmlns='http://www.w3.org/2000/svg' preserveAspectRatio='none'><rect x='0' y='0' height='100%' width='100%' fill='url(%23grad)' opacity='1'/><defs><radialGradient id='grad' gradientUnits='userSpaceOnUse' cx='0' cy='0' r='10' gradientTransform='matrix(-94.55 -29.75 59.5 -189.1 945.5 297.5)'><stop stop-color='rgba(44,38,32,0)' offset='0'/><stop stop-color='rgba(44,38,32,0)' offset='0.12559'/><stop stop-color='rgba(44,38,32,1)' offset='1'/></radialGradient></defs></svg>")}
[data-skin="corp"] #main .corp-hero-text{position:relative;z-index:1;width:500px;display:flex;flex-direction:column;gap:20px;color:#FFFFFF}
[data-skin="corp"] #main .corp-hero-text h1{font-size:52px;line-height:63px;font-weight:500;width:500px;color:#FFFFFF}
[data-skin="corp"] #main .corp-hero-text p{font-size:16px;line-height:24px;font-weight:400;opacity:.8;width:470px;color:#FFFFFF}
[data-skin="corp"] #main .corp-hero-btns{position:relative;z-index:1;display:flex;gap:20px}
[data-skin="corp"] #main .corp-hero-note{font-size:16px;line-height:24px;color:#7B756D;white-space:nowrap;text-align:center}

/* 3/4. Feature splits */
[data-skin="corp"] #main .corp-split{height:800px;display:flex;align-items:center;justify-content:center;gap:80px}
[data-skin="corp"] #main .corp-split-a{padding:120px 160px 120px 120px}
[data-skin="corp"] #main .corp-split-b{padding:120px 120px 120px 160px}
[data-skin="corp"] #main .corp-split-img{width:560px;height:560px;object-fit:cover;flex-shrink:0}
[data-skin="corp"] #main .corp-col520{width:520px;display:flex;flex-direction:column;gap:60px;align-items:flex-start;flex-shrink:0}
[data-skin="corp"] #main .corp-tgroup{display:flex;flex-direction:column;gap:20px;width:100%}
[data-skin="corp"] #main .corp-divider{position:absolute;left:140px;top:-0.5px;width:1160px;height:1px;background:#D6D2C7;z-index:2}

/* 5. Cards section */
[data-skin="corp"] #main .corp-cards-sec{height:871px;display:flex;flex-direction:column;align-items:center;gap:80px;padding:140px 80px}
[data-skin="corp"] #main .corp-cards-sec h2{width:750px;text-align:center}
[data-skin="corp"] #main .corp-cards{width:1200px;display:flex;gap:40px;align-items:stretch}
[data-skin="corp"] #main .corp-card{flex:1 0 0;min-width:0;background:#FFFFFF;border-radius:24px;padding:30px;box-shadow:0 12px 28px 0 rgba(0,0,0,0.06);overflow:hidden;display:flex;flex-direction:column;gap:45px;align-items:flex-start}
[data-skin="corp"] #main .corp-card-icon{width:40px;height:40px}
[data-skin="corp"] #main .corp-card-icon svg{width:40px;height:40px}
[data-skin="corp"] #main .corp-card-text{display:flex;flex-direction:column;gap:12px;width:100%}
[data-skin="corp"] #main .corp-card-text h3{font-size:24px;line-height:29px;font-weight:500;color:#121212}
[data-skin="corp"] #main .corp-card-text p{font-size:14px;line-height:21px;font-weight:400;color:#5C5750}

/* 6. Contact */
[data-skin="corp"] #main .corp-contact{height:800px;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:160px 80px}
[data-skin="corp"] #main .corp-contact-row{width:1120px;display:flex;align-items:center;gap:120px}
[data-skin="corp"] #main .corp-contact-img{width:480px;height:480px;border-radius:48px;object-fit:cover;flex-shrink:0}
[data-skin="corp"] #main .corp-btn-row{display:flex;gap:20px;align-items:center}

/* 7. CTA */
[data-skin="corp"] #main .corp-cta{display:flex;flex-direction:column;align-items:center;gap:60px;padding:0 80px 60px}
[data-skin="corp"] #main .corp-cta-card{width:1280px;height:491px;background:#F4F3F0;border-radius:48px;overflow:hidden;padding:100px 80px;display:flex;align-items:center;justify-content:center;flex-shrink:0}
[data-skin="corp"] #main .corp-cta-inner{display:flex;flex-direction:column;align-items:center;gap:60px}
[data-skin="corp"] #main .corp-cta-text{width:720px;display:flex;flex-direction:column;align-items:center;gap:30px;text-align:center}
[data-skin="corp"] #main .corp-cta-text h2{width:422px}
[data-skin="corp"] #main .corp-cta-text p{width:538px;color:#555049}
[data-skin="corp"] #main .corp-fine{font-size:14px;line-height:21px;color:#7B756D;text-align:center;white-space:nowrap}
[data-skin="corp"] #main .corp-fine a{color:#B75F00}

/* ---------- D3: reveals, the alt-home family (alt-home.css already rises every main section h2) ---------- */
@media (prefers-reduced-motion: no-preference){
  @supports (animation-timeline: view()){
    @keyframes corp-rise{from{opacity:0;transform:translateY(36px)}to{opacity:1;transform:none}}
    @keyframes corp-scale-in{from{opacity:0;transform:translateY(28px) scale(.965)}to{opacity:1;transform:none}}
    @keyframes corp-slide-l{from{opacity:0;transform:translateX(-40px)}to{opacity:1;transform:none}}
    @keyframes corp-slide-r{from{opacity:0;transform:translateX(40px)}to{opacity:1;transform:none}}
    [data-skin="corp"] #main .corp-hero-card{animation:corp-scale-in both;animation-timeline:view();animation-range:entry 0% entry 42%}
    [data-skin="corp"] #main .corp-cards,[data-skin="corp"] #main .corp-cta-card{animation:corp-rise both;animation-timeline:view();animation-range:entry 0% entry 48%}
    [data-skin="corp"] #main .corp-split-a .corp-split-img,[data-skin="corp"] #main .corp-split-b .corp-col520,
    [data-skin="corp"] #main .corp-contact-img{animation:corp-slide-l both;animation-timeline:view();animation-range:entry 0% entry 50%}
    [data-skin="corp"] #main .corp-split-a .corp-col520,[data-skin="corp"] #main .corp-split-b .corp-split-img,
    [data-skin="corp"] #main .corp-contact .corp-col520{animation:corp-slide-r both;animation-timeline:view();animation-range:entry 0% entry 50%}
  }
}

/* ---------- D1: below 1300 his fixed canvas relaxes (desktop only, D4; nothing here is a mobile layout) ---------- */
@media (max-width:1299.98px){
  [data-skin="corp"] #main .corp-wrap{width:100%;max-width:1440px}
  [data-skin="corp"] #main .corp-hero{height:auto;padding:0 40px 20px}
  [data-skin="corp"] #main .corp-hero-card{width:100%;height:auto;min-height:560px;padding:60px}
  [data-skin="corp"] #main .corp-hero-note{width:auto;max-width:100%;white-space:normal}
  [data-skin="corp"] #main .corp-hero-text,[data-skin="corp"] #main .corp-hero-text h1,[data-skin="corp"] #main .corp-hero-text p{width:auto;max-width:500px}
  [data-skin="corp"] #main .corp-hero-btns{flex-wrap:wrap}
  [data-skin="corp"] #main .corp-split{height:auto;gap:60px;padding:100px 60px}
  [data-skin="corp"] #main .corp-split-img{width:40%;height:auto;aspect-ratio:1/1}
  [data-skin="corp"] #main .corp-col520{width:auto;flex:1 1 0;min-width:0}
  [data-skin="corp"] #main .corp-divider{left:60px;right:60px;width:auto}
  [data-skin="corp"] #main .corp-cards-sec{height:auto;padding:100px 40px}
  [data-skin="corp"] #main .corp-cards-sec h2{width:auto;max-width:750px}
  [data-skin="corp"] #main .corp-cards{width:100%;max-width:1200px;gap:30px}
  [data-skin="corp"] #main .corp-contact{height:auto;padding:100px 60px}
  [data-skin="corp"] #main .corp-contact-row{width:100%;max-width:1120px;gap:60px}
  [data-skin="corp"] #main .corp-contact-img{width:38%;height:auto;aspect-ratio:1/1}
  [data-skin="corp"] #main .corp-btn-row{flex-wrap:wrap}
  [data-skin="corp"] #main .corp-cta{padding:0 40px 60px}
  [data-skin="corp"] #main .corp-cta-card{width:100%;height:auto;min-height:400px;padding:60px}
  [data-skin="corp"] #main .corp-cta-text,[data-skin="corp"] #main .corp-cta-text h2,[data-skin="corp"] #main .corp-cta-text p{width:auto;max-width:720px}
  [data-skin="corp"] #main .corp-fine{white-space:normal}
}

/* ---------- chrome that followup.css carried for this page (its lines 62-66, verbatim, keyed on data-skin) ---------- */
html[data-skin="corp"]:root:root:root:root:root:root header.site > .wrap.nav > .nav-cta > a.btn-primary{background:#121212!important;border-color:#121212!important;color:#fff!important;font-weight:700!important;height:47px!important;min-height:47px!important;padding:0 24px!important;display:inline-grid!important;place-items:center!important;line-height:normal!important}
html[data-skin="corp"]:root:root:root:root:root:root header.site > .wrap.nav > .nav-cta > a.btn-primary:hover{background:#2b2b2b!important;border-color:#2b2b2b!important}
html[data-skin="corp"]:root:root:root:root:root:root header.site > .wrap.nav > .nav-cta > a.btn-outline{background:#F4F3F0!important;border-color:#F4F3F0!important;color:#555049!important;font-weight:500!important;height:47px!important;min-height:47px!important;padding:0 24px!important;display:inline-grid!important;place-items:center!important;line-height:normal!important}
html[data-skin="corp"]:root:root:root:root:root:root header.site > .wrap.nav > .nav-cta > a.btn-outline:hover{background:#121212!important;border-color:#121212!important;color:#fff!important}
html[data-skin="corp"] .cookiebar .cb-accept{background:#121212!important;color:#fff!important}
