/* ============================================================
   BUSINESS . SMEs (companies.html) . 2026-10-12
   Ground truth: web/Buisness SMEs October 12/Spec & html/digidoe-business-smes.html
                 + digidoe-business-smes-page-spec.md; the PDF is 1440 x 8134 pt (1 pt = 1 px).
   Figma "DD-Website" frame "Business - SMEs" (1074:11256).

   Same recipe as sept-pemd.css: <main> IS the designer's markup (classes sme-*,
   qa/oracle/designer_to_main.py) and this is his stylesheet with the mechanical changes:
     .x                 -> [data-skin="sme"] #main .sme-x
     hero photo         -> his CSS background, data: URI -> sept/companies/hero.webp; his radial shade kept
     body min-width     -> gone (D1, Yuval 2026-10-12: no sideways scroll, like the business home since
                           06.10). 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, his 24px card titles 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; "Compare plans" goes to pricing.html#plans as
                live, he linked the in-page pricing section.
     closing    his 3D sliders photo replaces companies--clay-mixer.webp (Yuval 2026-10-12 "go").
     reveals    kept (D3): scroll-driven, same timing family as alt-home.css, defined at the end.
   ============================================================ */

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

/* ---------- resets his page relied on, scoped to main ---------- */
[data-skin="sme"] 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="sme"] #main{
  --black:#121212;--ink-nav:#2B2926;--grey-700:#555049;--grey-650:#5C5750;--grey-500:#7B756D;--grey-300:#C3C3C3;
  --beige:#F4F3F0;--border:#D6D2C7;--rule:#CCC8BC;--orange:#F37F00;--orange-dark:#B75F00;--orange-legal:#AC5900;--white:#FFFFFF;
}
[data-skin="sme"] #main *{box-sizing:border-box;margin:0;padding:0}
[data-skin="sme"] #main section{width:100%;padding:0;background:#fff;position:relative;height:auto;min-height:0}
[data-skin="sme"] #main h1,[data-skin="sme"] #main h2,[data-skin="sme"] #main h3{
  margin:0;font-weight:inherit;letter-spacing:normal!important;line-height:normal;text-wrap:auto;font-family:inherit;max-width:none;
}
[data-skin="sme"] #main p{margin:0;font-weight:inherit;letter-spacing:normal!important;line-height:inherit;text-wrap:auto;font-family:inherit;max-width:none;color:inherit}
[data-skin="sme"] #main a{color:inherit;text-decoration:none}
[data-skin="sme"] #main a:hover{text-decoration:none}
[data-skin="sme"] #main img,[data-skin="sme"] #main svg{display:block;max-width:none}
[data-skin="sme"] #main button{font-family:inherit;cursor:pointer}
[data-skin="sme"] #main section::before,[data-skin="sme"] #main section::after{content:none!important;display:none!important}

/* ---------- his stylesheet, prefixed ---------- */
[data-skin="sme"] #main .sme-band{width:100%}
[data-skin="sme"] #main .sme-wrap{width:1440px;max-width:none;margin:0 auto;padding:0;position:relative}
[data-skin="sme"] #main .sme-bg-beige{background:var(--beige)}
[data-skin="sme"] #main .sme-bg-white{background:#FFFFFF}
/* type */
[data-skin="sme"] #main .sme-h1{font-weight:500;font-size:52px;line-height:63px}
[data-skin="sme"] #main .sme-h2{font-weight:500;font-size:44px;line-height:53px;color:var(--black)}
[data-skin="sme"] #main .sme-p16{font-weight:400;font-size:16px;line-height:24px}
[data-skin="sme"] #main .sme-p16s{font-weight:400;font-size:16px;line-height:21.6px}
[data-skin="sme"] #main .sme-t24{font-weight:500;font-size:24px;line-height:29px;color:var(--black)}
[data-skin="sme"] #main .sme-center{text-align:center}

/* buttons */
[data-skin="sme"] #main .sme-btn{display:inline-flex;align-items:center;justify-content:center;height:47px;border-radius:100px;padding:14px 24px;font-size:16px;line-height:19px;white-space:nowrap;border:none;flex:none}
[data-skin="sme"] #main .sme-btn-dark{background:#121212;color:#FFFFFF;font-weight:700}
[data-skin="sme"] #main .sme-btn-light{background:#FFFFFF;color:#121212;font-weight:700}
[data-skin="sme"] #main .sme-btn-orange{background:#B75F00;color:#FFFFFF;font-weight:700}
[data-skin="sme"] #main .sme-btn-beige{background:#F4F3F0;color:#555049;font-weight:500}
[data-skin="sme"] #main .sme-btn-white{background:#FFFFFF;color:#555049;font-weight:500}
[data-skin="sme"] #main .sme-btn-ghost{background:rgba(18,18,18,0.16);color:#FFFFFF;font-weight:500}
[data-skin="sme"] #main .sme-btn:focus-visible{outline:2px solid #F37F00;outline-offset:2px}
[data-skin="sme"] #main .sme-icon{width:40px;height:40px;flex:none}

/* 2. HERO */
[data-skin="sme"] #main .sme-hero{height:684px;display:flex;flex-direction:column;align-items:center;gap:20px;padding:0 80px}
[data-skin="sme"] #main .sme-hero-card{position:relative;width:1280px;height:640px;border-radius:48px;overflow:hidden;flex:none;
  background:
   radial-gradient(ellipse 1010px 2020px at 969px 285px, rgba(44,38,32,0) 0%, rgba(44,38,32,0) 12.56%, rgba(44,38,32,1) 100%),
   url(sept/companies/hero.webp) center/cover no-repeat;
  padding:80px;display:flex;flex-direction:column;justify-content:center;align-items:flex-start;gap:40px}
[data-skin="sme"] #main .sme-hero-text{width:520px;display:flex;flex-direction:column;gap:20px}
[data-skin="sme"] #main .sme-hero-text .sme-h1{color:#FFFFFF}
[data-skin="sme"] #main .sme-hero-text .sme-p16{color:#FFFFFF;opacity:.8}
[data-skin="sme"] #main .sme-btn-row{display:flex;align-items:center;gap:20px}
[data-skin="sme"] #main .sme-hero-disc{width:867px;color:var(--grey-500);text-align:center;white-space:nowrap}

/* 3. ORGANISE */
[data-skin="sme"] #main .sme-s-organise{height:907px;display:flex;flex-direction:column;align-items:center;gap:80px;padding:120px 80px 140px}
[data-skin="sme"] #main .sme-head{display:flex;flex-direction:column;align-items:center}
[data-skin="sme"] #main .sme-cards-3{display:flex;gap:30px;width:1200px}
[data-skin="sme"] #main .sme-card-o{width:380px;height:242px;border:1px solid var(--border);border-radius:24px;padding:30px;display:flex;flex-direction:column;gap:30px;flex:none}
[data-skin="sme"] #main .sme-card-o .sme-txt{width:320px;display:flex;flex-direction:column;gap:10px}
[data-skin="sme"] #main .sme-card-o .sme-p16s{color:var(--grey-650)}

/* 4. BATCH */
[data-skin="sme"] #main .sme-s-batch{height:1391px;display:flex;flex-direction:column;align-items:center;gap:100px;padding:160px 80px 140px}
[data-skin="sme"] #main .sme-batch-top{width:830px;display:flex;flex-direction:column;align-items:center;gap:60px}
[data-skin="sme"] #main .sme-batch-img{width:928px;height:700px;object-fit:cover;flex:none}

/* 5. CROSS-BORDER */
[data-skin="sme"] #main .sme-s-cross{height:775px;display:flex;flex-direction:row;align-items:center;gap:160px;padding:200px 160px}
[data-skin="sme"] #main .sme-cross-left{width:480px;display:flex;flex-direction:column;align-items:flex-start;gap:40px;flex:none}
[data-skin="sme"] #main .sme-cross-right{width:480px;display:flex;flex-direction:column;gap:30px;flex:none}
[data-skin="sme"] #main .sme-row-c{width:480px;height:105px;background:var(--beige);border-radius:24px;padding:25px 30px;display:flex;align-items:center;gap:25px}
[data-skin="sme"] #main .sme-row-c .sme-txt{width:355px;display:flex;flex-direction:column;gap:4px}
[data-skin="sme"] #main .sme-row-c .sme-p16s{color:var(--grey-700)}

/* 6. POLICY */
[data-skin="sme"] #main .sme-s-policy{height:1014px;display:flex;flex-direction:column;align-items:center;gap:80px;padding:140px 80px 160px}
[data-skin="sme"] #main .sme-cards-p{display:flex;gap:40px;width:1200px;align-items:stretch}
[data-skin="sme"] #main .sme-card-p{width:373.333px;height:323px;background:#FFFFFF;border-radius:24px;padding:30px;box-shadow:0 12px 28px 0 rgba(0,0,0,0.06);display:flex;flex-direction:column;gap:30px;flex:none}
[data-skin="sme"] #main .sme-card-p .sme-txt{width:313.333px;display:flex;flex-direction:column;gap:15px}
[data-skin="sme"] #main .sme-card-p .sme-p16{color:var(--grey-500)}

/* 7. APPLY */
[data-skin="sme"] #main .sme-s-apply{height:800px;display:flex;flex-direction:row;justify-content:center;align-items:center;gap:120px;padding:160px 80px}
[data-skin="sme"] #main .sme-apply-img{width:480px;height:480px;border-radius:48px;object-fit:cover;flex:none}
[data-skin="sme"] #main .sme-col-text{width:520px;display:flex;flex-direction:column;gap:60px;flex:none}
[data-skin="sme"] #main .sme-col-text .sme-grp{display:flex;flex-direction:column;gap:20px}

/* divider */
[data-skin="sme"] #main .sme-divider{position:absolute;top:0;left:140px;width:1160px;height:1px;background:var(--border)}

/* 8. PRICING */
[data-skin="sme"] #main .sme-s-pricing{height:1034px;display:flex;flex-direction:column;align-items:center;gap:60px;padding:160px 80px}
[data-skin="sme"] #main .sme-plans{width:1280px;display:flex;flex-direction:column;align-items:center;gap:80px}
[data-skin="sme"] #main .sme-plan-row{display:flex;gap:30px;width:1280px}
[data-skin="sme"] #main .sme-plan{width:406.667px;height:353px;border-radius:24px;padding:30px;display:flex;flex-direction:column;justify-content:space-between;flex:none}
[data-skin="sme"] #main .sme-plan .sme-top{display:flex;flex-direction:column;gap:15px}
[data-skin="sme"] #main .sme-plan .sme-name{font-weight:500;font-size:28px;line-height:34px}
[data-skin="sme"] #main .sme-plan .sme-bottom{display:flex;flex-direction:column;gap:30px}
[data-skin="sme"] #main .sme-plan .sme-pricegrp{display:flex;flex-direction:column;gap:5px}
[data-skin="sme"] #main .sme-plan .sme-price-row{display:flex;align-items:flex-end;gap:5px;height:63px}
[data-skin="sme"] #main .sme-plan .sme-big{font-weight:500;font-size:52px;line-height:63px;white-space:nowrap}
[data-skin="sme"] #main .sme-plan .sme-per{font-weight:400;font-size:16px;line-height:24px;padding-bottom:7px}
[data-skin="sme"] #main .sme-plan .sme-note{font-weight:400;font-size:14px;line-height:21px}
[data-skin="sme"] #main .sme-plan .sme-btn{width:346.667px}
[data-skin="sme"] #main .sme-plan-core{background:var(--beige)}
[data-skin="sme"] #main .sme-plan-core .sme-name,[data-skin="sme"] #main .sme-plan-core .sme-big{color:var(--black)}
[data-skin="sme"] #main .sme-plan-core .sme-desc,[data-skin="sme"] #main .sme-plan-core .sme-per,[data-skin="sme"] #main .sme-plan-core .sme-note{color:var(--grey-700)}
[data-skin="sme"] #main .sme-plan-dyn{background:#FFFFFF;border:1px solid #B75F00;box-shadow:0 16px 48px -16px rgba(183,95,0,0.80)}
[data-skin="sme"] #main .sme-plan-dyn .sme-name,[data-skin="sme"] #main .sme-plan-dyn .sme-big{color:var(--black)}
[data-skin="sme"] #main .sme-plan-dyn .sme-desc,[data-skin="sme"] #main .sme-plan-dyn .sme-per,[data-skin="sme"] #main .sme-plan-dyn .sme-note{color:var(--grey-650)}
[data-skin="sme"] #main .sme-plan-prem{background:linear-gradient(112deg,#656565 0%,#343434 100%)}
[data-skin="sme"] #main .sme-plan-prem .sme-name,[data-skin="sme"] #main .sme-plan-prem .sme-big{color:#FFFFFF}
[data-skin="sme"] #main .sme-plan-prem .sme-desc,[data-skin="sme"] #main .sme-plan-prem .sme-per,[data-skin="sme"] #main .sme-plan-prem .sme-note{color:var(--grey-300)}
[data-skin="sme"] #main .sme-plan-prem .sme-from{font-weight:400;font-size:24px}
[data-skin="sme"] #main .sme-plan-prem .sme-sp{font-weight:500;font-size:24px}

/* 9. CLOSING */
[data-skin="sme"] #main .sme-s-close{height:760px;display:flex;flex-direction:row;align-items:center;gap:80px;padding:100px 120px 100px 160px}
[data-skin="sme"] #main .sme-close-img{width:560px;height:560px;object-fit:cover;flex:none;mix-blend-mode:multiply}
[data-skin="sme"] #main .sme-link-o{color:var(--orange-dark)}

/* ---------- 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 sme-rise{from{opacity:0;transform:translateY(36px)}to{opacity:1;transform:none}}
    @keyframes sme-scale-in{from{opacity:0;transform:translateY(28px) scale(.965)}to{opacity:1;transform:none}}
    @keyframes sme-slide-l{from{opacity:0;transform:translateX(-40px)}to{opacity:1;transform:none}}
    @keyframes sme-slide-r{from{opacity:0;transform:translateX(40px)}to{opacity:1;transform:none}}
    [data-skin="sme"] #main .sme-hero-card{animation:sme-scale-in both;animation-timeline:view();animation-range:entry 0% entry 42%}
    [data-skin="sme"] #main .sme-cards-3,[data-skin="sme"] #main .sme-cards-p,[data-skin="sme"] #main .sme-plan-row,
    [data-skin="sme"] #main .sme-batch-img{animation:sme-rise both;animation-timeline:view();animation-range:entry 0% entry 48%}
    [data-skin="sme"] #main .sme-cross-left,[data-skin="sme"] #main .sme-s-close .sme-col-text{animation:sme-slide-l both;animation-timeline:view();animation-range:entry 0% entry 50%}
    [data-skin="sme"] #main .sme-cross-right,[data-skin="sme"] #main .sme-close-img{animation:sme-slide-r both;animation-timeline:view();animation-range:entry 0% entry 50%}
    [data-skin="sme"] #main .sme-apply-img{animation:sme-slide-l both;animation-timeline:view();animation-range:entry 0% entry 50%}
    [data-skin="sme"] #main .sme-s-apply .sme-col-text{animation:sme-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="sme"] #main .sme-wrap{width:100%;max-width:1440px}
  [data-skin="sme"] #main .sme-hero{height:auto;padding:0 40px 20px}
  [data-skin="sme"] #main .sme-hero-card{width:100%;height:auto;min-height:560px;padding:60px}
  [data-skin="sme"] #main .sme-hero-disc{width:auto;max-width:100%;white-space:normal}
  [data-skin="sme"] #main .sme-s-organise,[data-skin="sme"] #main .sme-s-batch,[data-skin="sme"] #main .sme-s-cross,
  [data-skin="sme"] #main .sme-s-policy,[data-skin="sme"] #main .sme-s-apply,[data-skin="sme"] #main .sme-s-pricing,
  [data-skin="sme"] #main .sme-s-close{height:auto}
  [data-skin="sme"] #main .sme-head>*,[data-skin="sme"] #main .sme-batch-top,[data-skin="sme"] #main .sme-head{max-width:100%}
  [data-skin="sme"] #main .sme-cards-3,[data-skin="sme"] #main .sme-cards-p,[data-skin="sme"] #main .sme-plan-row,
  [data-skin="sme"] #main .sme-plans{width:100%;max-width:1200px}
  [data-skin="sme"] #main .sme-card-o,[data-skin="sme"] #main .sme-card-p,[data-skin="sme"] #main .sme-plan{flex:1 1 0;width:auto;min-width:0}
  [data-skin="sme"] #main .sme-card-o .sme-txt,[data-skin="sme"] #main .sme-card-p .sme-txt,[data-skin="sme"] #main .sme-row-c .sme-txt{width:auto}
  [data-skin="sme"] #main .sme-plan .sme-btn{width:100%}
  [data-skin="sme"] #main .sme-batch-img{width:100%;max-width:928px;height:auto}
  [data-skin="sme"] #main .sme-s-cross{gap:60px;padding:120px 60px}
  [data-skin="sme"] #main .sme-cross-left,[data-skin="sme"] #main .sme-cross-right{width:auto;flex:1 1 0;min-width:0}
  [data-skin="sme"] #main .sme-cross-left>div{width:auto!important}
  [data-skin="sme"] #main .sme-row-c{width:auto;height:auto;min-height:105px}
  [data-skin="sme"] #main .sme-s-apply{gap:60px;padding:120px 60px}
  [data-skin="sme"] #main .sme-apply-img{width:38%;height:auto;aspect-ratio:1/1}
  [data-skin="sme"] #main .sme-col-text{width:auto;flex:1 1 0;min-width:0}
  [data-skin="sme"] #main .sme-s-close{gap:40px;padding:80px 60px}
  [data-skin="sme"] #main .sme-close-img{width:40%;height:auto;aspect-ratio:1/1}
  [data-skin="sme"] #main .sme-divider{left:60px;right:60px;width:auto}
}

/* ---------- chrome that followup.css carried for this page (its lines 62-66, verbatim, keyed on data-skin) ---------- */
html[data-skin="sme"]: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="sme"]: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="sme"]: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="sme"]: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="sme"] .cookiebar .cb-accept{background:#121212!important;color:#fff!important}
