/* 4K Dental Models — shared stylesheet (preview build) */
:root{
  --paper:#FAFAF7; --card:#FFFFFF; --ink:#26282B; --ink-soft:#575B60;
  --rule:#DEDBD2; --brand:#F0921F; --brand-deep:#975606;
  --bench:#1B1D20; --bench-ink:#F4F3EE; --bench-soft:#A9ACA9;
}
*{margin:0;padding:0;box-sizing:border-box}
body{font-family:'IBM Plex Sans Arabic',system-ui,sans-serif;background:var(--paper);color:var(--ink);line-height:1.75;font-size:16.5px;-webkit-font-smoothing:antialiased}
img{display:block;max-width:100%;height:auto}
html{scroll-padding-top:150px}
main:focus{outline:none}
a{color:inherit;text-decoration:none}
ul{list-style-position:inside}
:focus-visible{outline:2px solid var(--brand-deep);outline-offset:3px}
.skip{position:absolute;inset-inline-start:-999px;top:8px;background:var(--ink);color:#fff;padding:8px 16px;z-index:99}
.skip:focus{inset-inline-start:8px}
.wrap{max-width:1140px;margin-inline:auto;padding-inline:clamp(18px,4vw,40px)}

/* header */
.top{background:var(--card);border-bottom:1px solid var(--rule);position:sticky;top:0;z-index:50}
.top-in{display:flex;align-items:center;gap:24px;min-height:68px;flex-wrap:wrap}
.brand{display:flex;align-items:center;gap:11px}
.brand img{width:48px;height:48px;object-fit:contain;background:#fff}
.brand b{font-size:14.5px;font-weight:600;line-height:1.35}
.brand span{display:block;font-size:11.5px;color:var(--ink-soft);font-weight:400}
.nav{display:flex;gap:22px;margin-inline-start:auto;font-size:15px;overflow-x:auto}
.nav a{padding:5px 2px;border-bottom:2px solid transparent;color:var(--ink-soft);white-space:nowrap}
.nav a:hover,.nav a.active{color:var(--ink);border-bottom-color:var(--brand)}
.top-actions{display:flex;align-items:center;gap:10px}
.lang{background:none;border:1px solid var(--rule);border-radius:999px;padding:6px 15px;font:inherit;font-size:14px;cursor:pointer;color:var(--ink)}
.lang:hover{border-color:var(--ink)}
.btn{display:inline-flex;align-items:center;justify-content:center;min-height:44px;padding:10px 20px;font:inherit;font-size:15px;font-weight:600;border-radius:3px;border:1px solid var(--ink);cursor:pointer;transition:background .15s,color .15s}
.btn-solid{background:var(--ink);color:#fff}.btn-solid:hover{background:#000}
.btn-ghost{background:transparent;color:var(--ink)}.btn-ghost:hover{background:var(--ink);color:#fff}
.btn-brand{background:var(--brand);border-color:var(--brand);color:#1B1D20}.btn-brand:hover{background:#DB7F12;border-color:#DB7F12}
.btn-sm{padding:8px 15px;font-size:14px}

/* hero (home) */
.hero{border-bottom:1px solid var(--rule)}
.hero-in{display:grid;grid-template-columns:1.05fr .95fr}
.hero-copy{padding-block:clamp(44px,6.5vw,88px);padding-inline-end:clamp(24px,4vw,56px)}
.tagline{font-size:14px;font-weight:600;letter-spacing:.02em;color:var(--brand-deep);margin-bottom:20px}
.hero h1{font-size:clamp(29px,4vw,48px);font-weight:700;line-height:1.35;letter-spacing:-.01em;margin-bottom:18px}
.hero .sub{max-width:50ch;color:var(--ink-soft);font-size:17px;margin-bottom:30px}
.hero-cta{display:flex;gap:12px;flex-wrap:wrap}
.hero-media{display:flex;align-items:center;justify-content:center;padding:clamp(20px,3vw,40px)}
.hero-media img{width:100%;max-width:520px;height:auto;border-radius:16px;box-shadow:0 26px 50px -26px rgba(38,40,43,.5);animation:hero-float 5.5s ease-in-out infinite alternate}
@keyframes hero-float{from{transform:translateY(0)}to{transform:translateY(-10px)}}
@keyframes hero-breathe{from{transform:scale(1)}to{transform:scale(1.05)}}

/* spec strip */
.spec{border-bottom:1px solid var(--rule);background:var(--card)}
.spec-in{display:grid;grid-template-columns:repeat(4,1fr)}
.spec div{padding:20px 8px;text-align:center;border-inline-start:1px solid var(--rule)}
.spec div:first-child{border-inline-start:none}
.spec b{display:block;font-size:23px;font-weight:700}
.spec span{font-size:13.5px;color:var(--ink-soft)}

/* sections */
section{padding-block:clamp(52px,7vw,92px)}
.sec-head{margin-bottom:clamp(24px,3.5vw,40px)}
.sec-head h2{font-size:clamp(23px,2.8vw,33px);font-weight:700;line-height:1.4}
.sec-head p{color:var(--ink-soft);font-size:15.5px;max-width:70ch;margin-top:6px}
.sec-head .btn{margin-top:16px}
.sec-split{display:flex;align-items:baseline;justify-content:space-between;gap:18px;flex-wrap:wrap;margin-bottom:clamp(24px,3.5vw,40px)}
.sec-split h2{font-size:clamp(23px,2.8vw,33px);font-weight:700}
.link-under{font-weight:600;font-size:15px;border-bottom:2px solid var(--brand);padding-bottom:2px}
.link-under:hover{color:var(--brand-deep)}

/* goals / index rows */
.goals-list{border-top:1px solid var(--ink)}
.goal{display:grid;grid-template-columns:96px 1fr auto;gap:clamp(16px,3vw,40px);align-items:center;padding-block:22px;border-bottom:1px solid var(--rule)}
.goal:hover{background:var(--card)}
.goal img{width:96px;height:96px;object-fit:contain;background:#fff;border:1px solid var(--rule);padding:7px}
.goal :is(h2,h3){font-size:19px;font-weight:600;margin-bottom:3px}
.goal p{color:var(--ink-soft);font-size:15px;max-width:64ch}
.goal .meta{font-size:13.5px;color:var(--ink-soft);white-space:nowrap}

/* product tiles */
.products-band{background:var(--card);border-block:1px solid var(--rule)}
.prod-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}
.prod-grid.cols-4{grid-template-columns:repeat(4,1fr)}
.tile{border:1px solid var(--rule);background:var(--paper);display:flex;flex-direction:column}
.tile .ph{aspect-ratio:1/1;overflow:hidden;background:#E9E7E0}
.tile .ph img{width:100%;height:100%;object-fit:cover;transition:transform .35s ease}
.tile:hover .ph img{transform:scale(1.02)}
.tile-body{padding:16px 18px 20px;display:flex;flex-direction:column;gap:4px;flex:1}
.tile-body .sku{font-size:12.5px;color:var(--ink-soft)}
.tile-body :is(h2,h3){font-size:17.5px;font-weight:600;line-height:1.5}
.tile-body :is(h2,h3) a:hover{color:var(--brand-deep)}
.tile-body p{font-size:14px;color:var(--ink-soft)}
.tile-foot{margin-top:auto;padding-top:12px;display:flex;align-items:center;justify-content:space-between;gap:8px}
.price-note{font-size:13.5px;color:var(--ink-soft)}
.tile-foot a{font-weight:600;font-size:14px;border-bottom:2px solid var(--brand);padding-bottom:1px}
.tile-foot a:hover{color:var(--brand-deep)}
.badges{display:flex;gap:6px;flex-wrap:wrap;margin-top:6px}
.badge{font-size:12px;border:1px solid var(--rule);background:var(--card);padding:2px 9px;color:var(--ink-soft)}
.dist-card{transition:transform .25s ease,box-shadow .25s ease}
.dist-card:hover,.dist-card:focus-visible{transform:perspective(700px) translateY(-5px) rotateX(2.5deg);box-shadow:0 16px 28px -16px rgba(38,40,43,.4)}
.dist-card:active{transform:perspective(700px) translateY(-4px) rotateX(2deg)}

/* compare (dark) */
.compare{background:var(--bench);color:var(--bench-ink)}
.compare .sec-head h2{color:#fff}
.compare .sec-head p{color:var(--bench-soft)}
.compare-grid{display:grid;grid-template-columns:1fr 1fr;gap:clamp(18px,3vw,36px)}
.compare img{width:100%;object-fit:cover;border:1px solid #3A3D40;background:#0C0D0F}
.compare .r-1-1{aspect-ratio:1/1}.compare .r-3-4{aspect-ratio:3/4}
.compare figcaption{margin-top:10px;font-size:14px;color:var(--bench-soft);display:flex;justify-content:space-between;gap:10px}
.compare figcaption b{color:var(--bench-ink);font-weight:600}
.compare-grid figure{display:flex;flex-direction:column}
.compare-grid img{flex:1}

/* features */
.feat-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(22px,3.5vw,44px)}
.feat{border-top:2px solid var(--ink);padding-top:18px}
.feat h3{font-size:18px;font-weight:600;margin-bottom:7px}
.feat p{font-size:15px;color:var(--ink-soft)}

/* founder */
.founder blockquote{font-size:clamp(18px,2.2vw,23px);font-weight:500;line-height:1.8;max-width:62ch}
.founder cite{display:block;margin-top:14px;font-style:normal;font-size:15px;color:var(--ink-soft)}
.founder cite b{color:var(--ink);font-weight:600}

/* cta + footer */
.cta{background:var(--bench);color:var(--bench-ink)}
.cta-in{display:flex;align-items:center;justify-content:space-between;gap:28px;flex-wrap:wrap}
.cta h2{font-size:clamp(22px,2.8vw,31px);font-weight:700;color:#fff;margin-bottom:8px}
.cta p{color:var(--bench-soft);max-width:50ch}
.cta-actions{display:flex;gap:12px;flex-wrap:wrap}
.cta .btn-ghost{color:#fff;border-color:#4A4E52}
.cta .btn-ghost:hover{background:#fff;color:var(--ink);border-color:#fff}
footer{background:#141619;color:var(--bench-soft);font-size:14px}
.foot-in{display:grid;grid-template-columns:1.4fr 1fr 1fr;gap:clamp(26px,4vw,56px);padding-block:48px 36px}
.foot-in img{width:58px;height:58px;object-fit:contain;margin-bottom:14px}
.foot-in h2{color:#fff;font-size:14.5px;font-weight:600;margin-bottom:12px}
.foot-in ul{list-style:none;display:grid;gap:8px}
.foot-in a:hover{color:#fff}
.foot-base{border-top:1px solid #2A2D31;padding-block:18px;display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap;font-size:13px}

/* breadcrumb */
.crumbs{font-size:13.5px;color:var(--ink-soft);padding-block:16px 0}
.crumbs ol{list-style:none;display:flex;flex-wrap:wrap;gap:6px}
.crumbs li:not(:last-child)::after{content:"\2190";margin-inline-start:6px;color:var(--rule)}
[dir="ltr"] .crumbs li:not(:last-child)::after{content:"\2192"}
.crumbs a:hover{color:var(--brand-deep)}

/* category page */
.cat-lede{max-width:70ch;color:var(--ink-soft);margin-bottom:8px}

/* product page */
.product-top{display:grid;grid-template-columns:1fr 1fr;gap:clamp(24px,4vw,56px);align-items:start}
.gallery-main{aspect-ratio:1/1;background:#0C0D0F;border:1px solid var(--rule);display:flex;align-items:center;justify-content:center;overflow:hidden}
.gallery-main img{width:100%;height:100%;object-fit:contain}
.gallery-thumbs{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;margin-top:10px}
.gallery-thumbs button{border:1px solid var(--rule);background:var(--card);padding:0;cursor:pointer;aspect-ratio:1/1;overflow:hidden}
.gallery-thumbs button.active{border-color:var(--ink);box-shadow:inset 0 0 0 1px var(--ink)}
.gallery-thumbs img{width:100%;height:100%;object-fit:cover}
.product-info h1{font-size:clamp(26px,3vw,38px);font-weight:700;line-height:1.4;margin-bottom:6px}
.product-info .sku{font-size:14px;color:var(--ink-soft);margin-bottom:14px}
.product-info .desc{color:var(--ink-soft);font-size:16.5px;margin-bottom:22px}
.product-buy{display:flex;gap:12px;flex-wrap:wrap;margin-block:22px 8px}
.product-sections{display:grid;gap:clamp(28px,4vw,44px);margin-top:clamp(36px,5vw,60px)}
.psec{border-top:2px solid var(--ink);padding-top:18px}
.psec h2{font-size:20px;font-weight:700;margin-bottom:10px}
.psec p{max-width:75ch}
.psec ol,.psec ul{padding-inline-start:0;margin-top:4px;display:grid;gap:6px}
.psec li{padding-inline-start:0}
.psec ol{counter-reset:li;list-style:none}
.psec ol li::before{counter-increment:li;content:counter(li);display:inline-block;min-width:1.6em;color:var(--brand-deep);font-weight:700}
.related{background:var(--card);border-top:1px solid var(--rule)}

/* events & workshops */
.events-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(16px,2.5vw,26px)}
.events-grid.cols-4{grid-template-columns:repeat(4,1fr)}
.events-grid figure{border:1px solid var(--rule);background:var(--card);display:flex;flex-direction:column}
.events-grid img{width:100%;aspect-ratio:1/1;object-fit:cover}
.events-grid figcaption{padding:12px 14px;border-top:1px solid var(--rule)}
.events-grid figcaption b{display:block;font-size:15px;font-weight:600}
.events-grid figcaption span{font-size:13.5px;color:var(--ink-soft)}
.cert{display:grid;grid-template-columns:1.15fr .85fr;gap:clamp(18px,3vw,40px);align-items:center;border:1px solid var(--rule);background:var(--card);margin-top:clamp(16px,2.5vw,26px);padding:clamp(16px,3vw,30px)}
.cert img{width:100%;max-height:320px;object-fit:contain}
.cert b{display:block;font-size:17px;font-weight:700;margin-bottom:6px}
.cert p{color:var(--ink-soft);font-size:15px;max-width:60ch}

/* forms */
.form{display:grid;gap:16px;max-width:640px}
.form label{font-size:14.5px;font-weight:600;display:grid;gap:6px}
.form input,.form select,.form textarea{font:inherit;font-size:16px;padding:10px 14px;border:1px solid #888B90;background:var(--card);color:var(--ink);border-radius:3px;width:100%;min-width:0}
.form textarea{resize:vertical}
.form-actions{display:flex;flex-wrap:wrap;gap:12px}
.form-actions .btn{max-width:100%;text-align:center}
.nav a,.lang{min-height:44px;display:inline-flex;align-items:center;justify-content:center}
.product-info,.goal>div,.tile{min-width:0;overflow-wrap:anywhere}
.form input:focus,.form select:focus,.form textarea:focus{outline:2px solid var(--brand);outline-offset:0}
.form .hp{position:absolute;inset-inline-start:-9999px}
.alert{border:1px solid var(--rule);border-inline-start:4px solid var(--brand);background:var(--card);padding:14px 18px;max-width:640px;margin-bottom:22px}
.form-note{font-size:13.5px;color:var(--ink-soft)}

/* about */
.about-grid{display:grid;grid-template-columns:1.2fr .8fr;gap:clamp(28px,4vw,56px)}
.about-grid .prose p{margin-bottom:14px;max-width:65ch}
.facts{border:1px solid var(--rule);background:var(--card)}
.facts div{padding:14px 18px;border-bottom:1px solid var(--rule)}
.facts div:last-child{border-bottom:none}
.facts b{display:block;font-size:15px}
.facts span{font-size:13.5px;color:var(--ink-soft)}

/* responsive */
@media (max-width:960px){
  .top-in{row-gap:0;padding-block:12px 0}
  .nav{order:3;width:100%;margin-inline-start:0;justify-content:space-between;gap:12px;padding-block:9px 10px;border-top:1px solid var(--rule)}
  .top-actions{margin-inline-start:auto}
  .hero-in{grid-template-columns:1fr}
  .hero{overflow:hidden}
  .hero-media{order:-1;margin-inline:calc(clamp(18px,4vw,40px) * -1);padding:0;overflow:hidden}
  .hero-media img{max-width:560px;max-height:58vh;object-fit:contain;border-radius:0;box-shadow:none;animation:hero-breathe 8s ease-in-out infinite alternate}
  .prod-grid,.prod-grid.cols-4{grid-template-columns:1fr 1fr}
  .compare-grid{grid-template-columns:1fr}
  .compare .r-3-4{max-height:520px}
  .feat-grid{grid-template-columns:1fr}
  .product-top{grid-template-columns:1fr}
  .about-grid{grid-template-columns:1fr}
  .events-grid,.events-grid.cols-4{grid-template-columns:1fr 1fr}
  .foot-in{grid-template-columns:1fr 1fr}
}
@media (max-width:620px){
  body{font-size:15.5px}
  .top-in{min-height:0;gap:10px}
  .brand{gap:9px}
  .brand img{width:38px;height:38px}
  .brand b{font-size:12.5px;line-height:1.3}
  .brand span{display:none}
  .lang{padding:5px 11px;font-size:12.5px}
  .top-actions{gap:8px}
  .top-actions .btn{padding:7px 11px;font-size:12.5px}
  .nav{gap:10px;font-size:13.5px;padding-block:8px 9px}
  .btn{padding:9px 14px;font-size:14px}
  .spec-in{grid-template-columns:1fr 1fr}
  .spec div:nth-child(odd){border-inline-start:none}
  .spec div:nth-child(n+3){border-top:1px solid var(--rule)}
  .prod-grid,.prod-grid.cols-4{grid-template-columns:1fr}
  .goal{grid-template-columns:72px 1fr;row-gap:6px}
  .goal img{width:72px;height:72px}
  .goal .meta{grid-column:2;white-space:normal}
  .events-carousel{
    display:flex;
    gap:14px;
    overflow-x:auto;
    scroll-snap-type:x mandatory;
    -webkit-overflow-scrolling:touch;
    scrollbar-width:thin;
    margin-inline:calc(clamp(18px,4vw,40px) * -1);
    padding-inline:clamp(18px,4vw,40px);
    padding-bottom:6px;
  }
  .events-carousel figure{flex:0 0 78%;scroll-snap-align:start}
  .events-grid,.events-grid.cols-4{grid-template-columns:1fr}
  .cert{grid-template-columns:1fr}
  .foot-in{grid-template-columns:1fr}
}
@media (max-width:400px){
  .top-actions .btn{display:none}
}
@media (prefers-reduced-motion:reduce){*,*::before,*::after{transition:none!important;animation:none!important}}
