/* Visual refinement: the same loud palette, with a clearer hierarchy. */
:root{--section-gap:100px}
::selection{background:var(--yellow);color:var(--ink)}
h1,h2,h3{text-wrap:balance}p{text-wrap:pretty}
header{padding-block:28px}
.brand{font-size:36px}
nav>a:not(.nav-cta){text-underline-offset:7px}
nav>a:not(.nav-cta):hover{text-decoration:underline;text-decoration-thickness:2px}
.nav-cta{background:var(--paper);transition:transform .18s,box-shadow .18s}
.hero{padding-top:90px;padding-bottom:110px;gap:64px;align-items:center}
h1{font-size:clamp(46px,5.1vw,72px);letter-spacing:-3.6px;line-height:1.02}
.hero-copy>p{max-width:460px;margin-top:28px;line-height:1.7}
.hero-actions{flex-wrap:wrap;gap:20px 26px;margin-top:32px}
.hero-actions .button{min-height:56px}
.desktop-scene{isolation:isolate;padding-bottom:65px}
.desktop-scene::before{content:"";position:absolute;inset:0 -12px 30px -22px;z-index:-1;background-image:radial-gradient(var(--blue) .8px,transparent .8px);background-size:14px 14px;opacity:.18;mask-image:linear-gradient(135deg,transparent,#000 35%,#000 70%,transparent)}
.profile{box-shadow:10px 10px 0 var(--ink)}
.profile-screen{background-color:#bdd8ed;background-size:28px 28px}
.profile-photo{height:300px;filter:grayscale(1) contrast(1.16) brightness(1.04)}
.sticker{padding:20px 16px;box-shadow:5px 5px 0 var(--ink);top:-25px;right:-3px}
.mini-window{bottom:-2px;right:-4px}
.scene-star{bottom:9px;left:-30px}
.fun-stats,.work-showcase,.projects{padding-bottom:var(--section-gap)}
.section-heading,.work-top{margin-bottom:36px}
.section-heading h2,.work-top h2{font-size:clamp(32px,3.6vw,48px);line-height:1.08;letter-spacing:-1.8px}
.eyebrow{display:inline-block;background:#e6e7df;padding:5px 9px;border-left:3px solid var(--ink);font-size:12px}
.dashboard{grid-template-columns:repeat(12,minmax(0,1fr));gap:18px}
.dash-card{grid-column:span 4;min-height:245px;padding:26px;box-shadow:4px 4px 0 var(--ink)}
.dash-phrase{grid-column:span 5}
.dash-tabs{grid-column:span 4}
.dash-ring{grid-column:span 3}
.dash-phrase>strong{font-size:clamp(27px,3.1vw,40px);max-width:330px;margin:20px 0 25px;letter-spacing:-1.3px}
.dash-wave{margin-top:auto}
.dash-wave i{width:10px}
.dash-label{font-size:13px;line-height:1.45;max-width:32ch}
.dash-number{font-size:86px;margin:12px 0 20px}
.dash-tabs .dash-number{font-size:80px; padding-right:65px;margin-top:auto}
.confidence-ring{width:142px;height:142px;margin:20px auto 5px}
.dash-chart{background-color:#e5e9ff;background-image:linear-gradient(#163ddd09 1px,transparent 1px);background-size:100% 24px}
.dash-docs{background:var(--paper)}
.work-top{border-top:var(--line);padding-top:40px}
.work-employer{padding-left:14px;border-left:3px solid var(--blue)}
.case-switcher{background:transparent;border:0;gap:6px;align-items:end}
.case-switcher button{border:var(--line);border-bottom:0;background:#e9e8e0;position:relative;min-height:53px;font-size:14px}
.case-switcher button:last-child{border-right:var(--line)}
.case-switcher button[aria-pressed=true]{min-height:62px}
.case-stage{box-shadow:7px 7px 0 var(--ink)}
.case-summary{padding:38px}
.case-change p{font-size:15px}
.case-client{font-size:13px}
.case-diagram{background-image:radial-gradient(#163ddd30 .8px,transparent .8px);background-size:14px 14px}
.case-proof strong{font-size:clamp(40px,5vw,68px)}
.case-tools span{background:white;border-color:#b2b9c0}
.case-more summary:hover,.career-footnote>summary:hover{background:var(--yellow)}
.career-footnote>summary{padding-inline:14px;font-size:14px}
.projects .section-heading{align-items:end}
.projects .section-heading h2{max-width:900px;font-size:clamp(30px,3.3vw,44px)}
.projects .section-heading p{display:inline-block;margin-top:17px;padding:3px 10px;background:var(--yellow);transform:rotate(-2deg);font-weight:bold;font-size:14px}
.stamp{margin:0 10px 12px 20px;box-shadow:3px 3px 0 var(--blue);padding:14px;background:var(--paper)}
.project{box-shadow:5px 5px 0 var(--ink);display:flex;flex-direction:column;transition:transform .2s,box-shadow .2s}
.project-chrome{display:flex;justify-content:space-between;align-items:center;padding:8px 11px;background:var(--ink);color:white;font:600 12px/1.4 Consolas,'Lucida Console',monospace;gap:8px}
.project-chrome span:last-child{white-space:nowrap;color:var(--yellow)}
.project-art{height:240px;flex-shrink:0}
.art-one{background-image:linear-gradient(#ffffff50 1px,transparent 1px),linear-gradient(90deg,#ffffff50 1px,transparent 1px);background-size:24px 24px}
.art-two{background-image:radial-gradient(#17252b22 1px,transparent 1px);background-size:10px 10px}
.art-three{background-image:repeating-linear-gradient(-45deg,transparent 0 15px,#ffffff30 15px 16px)}
.project-body{padding:26px;display:flex;flex-direction:column;flex:1}
.project h3{font-size:26px;line-height:1.1;letter-spacing:-.8px;margin:14px 0}
.project p{font-size:15px;line-height:1.65;min-height:0;margin-bottom:24px}
.project-body .demo-link{margin-top:auto;align-self:stretch;text-align:left;min-height:45px;border-top:1px solid #c3c7c8;border-bottom:0;font-size:14px;display:flex;align-items:center;justify-content:space-between}
.project-body .demo-link:hover{color:var(--blue)}
.project-number{background:var(--paper);border:1px solid var(--ink);padding:2px 7px}
.classifieds{gap:24px;margin-bottom:var(--section-gap)}
.classifieds article{padding:34px;box-shadow:5px 5px 0 var(--ink);display:flex;flex-direction:column;align-items:flex-start}
.classifieds h2{font-size:clamp(26px,2.6vw,34px);line-height:1.14;max-width:25ch}
.classifieds .button,.classifieds .demo-link{margin-top:auto}
.classifieds p{margin-bottom:25px}
.ad-label{font-size:11px;letter-spacing:.5px;border-bottom:1px solid currentColor;padding-bottom:8px;width:100%}
.doctors{background-color:var(--yellow)}
.doctors .demo-link{font-size:14px;min-height:44px}
.offer-section{margin-bottom:90px}
.offer-section>h2{position:relative;z-index:1;margin-bottom:-18px}
.offer-section .offer{padding-top:58px;padding-bottom:40px;outline:1px dashed var(--ink);outline-offset:-12px;gap:28px}
.offer .offer-price strong{font-size:clamp(50px,8vw,110px);letter-spacing:-5px}
.offer .offer-clock{box-shadow:5px 5px 0 var(--ink);padding:18px 40px}
footer{max-width:1320px;margin:auto;gap:24px;padding-top:32px;border-top:var(--line)}
.cookies{max-width:1080px;margin-inline:auto;box-shadow:5px 5px 0 var(--ink);border-top:5px solid var(--blue)}
.cookie-buttons button{transition:background .15s,transform .15s}
.cookie-buttons button:hover{background:var(--yellow)}
.button:active,.nav-cta:active{transform:translate(3px,3px);box-shadow:1px 1px 0 var(--ink)}
dialog::backdrop{background:#17252b80;backdrop-filter:blur(4px)}
.demo,.prize{box-shadow:10px 10px 0 var(--ink)}
@media(hover:hover) and (prefers-reduced-motion:no-preference){.project:hover{transform:translateY(-6px);box-shadow:5px 11px 0 var(--ink)}.project:hover .browser-mini{transform:rotate(-2deg)}.project:hover .error-card{transform:rotate(0)}.browser-mini,.error-card{transition:transform .25s}}
@media(max-width:1050px){.hero{gap:40px;padding-inline:30px}h1{font-size:clamp(46px,5.4vw,62px)}.dash-card{padding:20px}.dash-tabs .dash-number{font-size:65px}.confidence-ring{width:115px;height:115px}.project-body{padding:21px}.project h3{font-size:24px}.classifieds,.offer-section{margin-inline:30px}.project-grid{gap:18px}.project-art{height:220px}}
@media(max-width:800px) and (min-width:701px){.hero{grid-template-columns:1fr 1fr;gap:24px}.hero h1{font-size:44px;letter-spacing:-2px}.hero-copy>p{font-size:15px}.profile-photo{height:240px}.dashboard{grid-template-columns:repeat(2,minmax(0,1fr))}.dash-card{grid-column:auto}.project-grid{grid-template-columns:1fr}.project{display:grid;grid-template-columns:1fr 1fr}.project-chrome{grid-column:1/-1}.project-art{height:100%;min-height:260px;border-bottom:0;border-right:var(--line)}}
@media(max-width:700px){:root{--section-gap:64px}header{padding:23px 20px}.brand{font-size:29px}.hero{padding:48px 20px 66px;gap:65px;grid-template-columns:1fr}.hero h1{font-size:clamp(42px,9.5vw,65px);letter-spacing:-2px}.hero-copy>p{font-size:16px;max-width:460px}.hero-actions{gap:20px}.desktop-scene{width:100%;max-width:480px;margin:auto;padding:15px 15px 100px 8px}.desktop-scene::before{inset:0 0 50px}.profile-photo{height:270px}.mini-window{right:0;bottom:0}.sticker{right:5px;top:-20px;font-size:13px;padding:15px}.scene-star{left:0;bottom:28px;font-size:70px}.fun-stats,.work-showcase,.projects{padding-inline:20px}.section-heading,.work-top{margin-bottom:25px}.section-heading h2,.work-top h2{font-size:34px;letter-spacing:-1.3px}.dashboard{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.dash-card{grid-column:auto;min-height:220px;padding:17px}.dash-phrase{grid-column:1/-1;min-height:220px}.dash-phrase>strong{font-size:36px;max-width:320px}.dash-label{font-size:12px}.dash-tabs .dash-number{font-size:58px;padding-right:0;margin-top:18px}.dash-number{font-size:64px}.dash-docs{grid-column:1/-1;min-height:190px}.confidence-ring{width:110px;height:110px}.work-top{padding-top:28px}.case-switcher{gap:0;align-items:stretch}.case-switcher button,.case-switcher button[aria-pressed=true]{min-height:48px;border:var(--line);border-bottom:0}.case-summary{padding:25px}.projects .section-heading h2{font-size:32px}.stamp{margin:10px 0 0;padding:9px}.project-grid{gap:28px}.project-art{height:245px}.project-body{padding:25px}.project h3{font-size:28px}.classifieds{margin-inline:20px;gap:24px}.classifieds article{padding:26px}.classifieds h2{font-size:29px}.offer-section{margin-inline:20px;margin-bottom:65px}.offer-section .offer{padding:45px 18px 28px;outline-offset:-8px}.offer .offer-price strong{font-size:clamp(38px,10vw,64px);letter-spacing:-2.5px}.offer .offer-clock{padding:15px 18px}.offer .offer-discount{font-size:17px}.cookies{gap:10px}.cookie-buttons{display:grid;grid-template-columns:1fr 1fr;gap:8px}.cookie-buttons button{min-height:44px;font-size:12px}.cookies p{font-size:12px}.cookies b{font-size:13px}footer{margin-inline:20px;padding-inline:0;padding-bottom:230px}.project-chrome{font-size:12px}.work-employer{font-size:12px}}
@media(prefers-reduced-motion:reduce){.project,.browser-mini,.error-card,.nav-cta,.cookie-buttons button{transition:none}}

@media(min-width:701px){.hero{align-items:start;padding-top:72px}.hero-copy{padding-top:22px}}

/* Language selection stays visible at every breakpoint. */
.language-switch{display:flex;border:var(--line);flex-shrink:0;font:700 12px/1 Consolas,monospace;background:var(--paper)}
.language-switch a{display:grid;place-items:center;min-width:40px;min-height:42px;padding:10px;text-decoration:none}
.language-switch a+a{border-left:var(--line)}
.language-switch a[aria-current=true]{background:var(--blue);color:white}
.language-switch a:hover:not([aria-current]){background:var(--yellow)}
.ticker-repeat{display:none}
@keyframes ticker-marquee{to{transform:translateX(-50%)}}
@media(max-width:700px){
  .ticker{padding-block:12px}
  .ticker .ticker-track{display:flex;width:max-content;text-align:left;word-spacing:4px;animation:ticker-marquee 28s linear infinite}
  .ticker-copy{display:block;flex:none;padding-right:28px;white-space:nowrap}
  .ticker:active .ticker-track{animation-play-state:paused}
}
@media(max-width:700px) and (hover:hover){.ticker:hover .ticker-track{animation-play-state:paused}}
@media(max-width:700px) and (prefers-reduced-motion:reduce){
  .ticker .ticker-track{display:block;width:auto;animation:none;padding-inline:20px;text-align:center;line-height:1.9}
  .ticker-copy{white-space:normal;padding:0;text-wrap:balance}
  .ticker-repeat{display:none}
}
header{display:grid;grid-template-columns:minmax(0,1fr) auto auto;gap:24px;align-items:center}
header nav{gap:22px}
html[lang=en] .hero h1{font-size:clamp(42px,4.5vw,66px)}
html[lang=en] .project-chrome{font-size:11px}
@media(max-width:900px){header{gap:20px}header nav{gap:14px}.nav-cta{padding-inline:12px}}

@media(min-width:701px) and (max-width:1000px){
  header{grid-template-columns:minmax(0,1fr) auto;gap:18px 24px}
  header .brand{grid-column:1;grid-row:1}
  header .language-switch{grid-column:2;grid-row:1}
  header nav{grid-column:1/-1;grid-row:2;justify-content:flex-end}
}
@media(max-width:700px){
  header{grid-template-columns:minmax(0,1fr) auto;padding:18px 20px 14px;gap:14px 12px}
  header .brand{grid-column:1;grid-row:1;font-size:28px;min-width:0}
  header .brand small{max-width:none;font-size:11px;line-height:1.4;letter-spacing:0;margin-top:7px;text-wrap:balance}
  header .language-switch{grid-column:2;grid-row:1;align-self:center}
  .language-switch a{min-height:44px;min-width:36px;padding:8px;font-size:11px}
  header nav{grid-column:1/-1;grid-row:2;display:grid;grid-template-columns:.8fr .95fr 1.65fr;gap:10px;align-items:stretch;width:100%;font-size:12px}
  header nav>a{display:flex;align-items:center;justify-content:center;min-width:0;min-height:44px;text-align:center;line-height:1.25}
  header nav>a:not(.nav-cta){display:flex;font-size:12px;border-bottom:2px solid #17252b26;text-decoration:none}
  header .nav-cta{max-width:none;padding:8px 7px;background:var(--blue);color:white;box-shadow:2px 2px 0 var(--ink);font-size:11px}
  .hero{padding-top:36px}
  html[lang=en] .hero h1{font-size:clamp(38px,9.4vw,62px);letter-spacing:-2px}
  html[lang=en] .case-proof strong{font-size:40px}
}


