/* Shared layout and services. Hero, portfolio and intro own separate components. */
:root{--pink:#ec619b;--background:#0b0b0d;--surface:#111114;--text:#e7e3e5;--muted:#bfb8bc;--line:#ec619b40;color-scheme:dark}
*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:100px}body{margin:0;background:var(--background);color:var(--pink);font-family:Arial,Helvetica,sans-serif;-webkit-font-smoothing:antialiased;position:relative;isolation:isolate}
body::before{content:'';position:fixed;inset:0;z-index:-1;pointer-events:none;background:url('assets/veins-texture.jpg') center/cover no-repeat;opacity:.4;mix-blend-mode:screen}
button,a{-webkit-tap-highlight-color:transparent}button{font:inherit;cursor:pointer}button:disabled{cursor:default}a{color:inherit;text-decoration:none}a:focus-visible,button:focus-visible,[tabindex]:focus-visible{outline:2px solid var(--pink);outline-offset:5px}::selection{background:var(--pink);color:var(--background)}[hidden]{display:none}
.skip{position:fixed;top:-90px;left:20px;z-index:10001;background:var(--background);padding:15px}.skip:focus{top:10px}
.site-header{position:absolute;top:0;width:100%;padding:22px 5%;min-height:90px;display:flex;align-items:center;justify-content:space-between;gap:18px;z-index:60}
.brand img{width:128px;height:auto;display:block}.site-header nav,.nav-links{display:flex;align-items:center;gap:28px;font-size:14px}.nav-links a{padding:12px 0}.nav-links a:hover{text-decoration:underline;text-underline-offset:6px}.menu-toggle{display:none;background:transparent;border:1px solid var(--line);color:var(--pink);padding:10px 12px;border-radius:6px;min-height:44px}
.quote{display:inline-flex;align-items:center;justify-content:center;gap:24px;min-height:50px;padding:14px 24px;border:1px solid #fff;border-radius:6px;background:#fff;color:#111;font-size:14px;transition:transform .25s,box-shadow .25s}.quote:hover{transform:translateY(-3px);box-shadow:0 8px 30px #ffffff25}.quote span{display:inline-flex;transition:transform .25s}.quote:hover span{transform:translate(3px,-3px)}
.vena-arrow{display:inline-block;width:24px;height:24px;vertical-align:middle;flex-shrink:0}.instagram-link .vena-arrow{width:16px;height:16px}
.eyebrow{font-size:12px;letter-spacing:.12em;line-height:1.55;margin:0}p{font-size:16px;line-height:1.7}h2{font-weight:400;letter-spacing:-.055em;line-height:1.08;margin:0;font-size:clamp(40px,5.5vw,86px)}h2 em,.service-lead em{font-family:Georgia,serif;font-weight:400;letter-spacing:-.055em}
.studio{padding:100px 7%;display:grid;grid-template-columns:25% 75%;border-top:1px solid var(--line)}.studio h2{font-size:clamp(38px,4.9vw,72px)}.studio-copy{display:grid;grid-template-columns:1fr 1fr;gap:50px;margin-top:45px;max-width:850px}.studio-copy p{margin:0;color:var(--text)}
/* Direct selection: no sticky section, wheel interception or scroll-driven slide changes. */
.services{background:#111114c9;position:relative;overflow:hidden}.services-sticky{position:relative;padding:38px 6% 30px}.service-topline{position:relative;z-index:3;margin-bottom:25px}.service-art{display:none;pointer-events:none}.service-art canvas{display:block;width:100%;height:100%}
.service-panel{padding:35px 0}.service-panel h2{font-size:clamp(38px,4.4vw,68px)}.service-panel p{max-width:430px;margin:20px 0;color:var(--text)}.service-panel .service-lead{font-size:clamp(23px,2.2vw,34px);line-height:1.2;letter-spacing:-.035em;color:var(--pink);margin:20px 0 5px}.service-tags{display:block;border-top:1px solid var(--line);padding-top:18px;max-width:430px;font-size:12px;line-height:1.7;color:var(--muted)}
.services-bottom{display:none;margin-bottom:28px}.enhanced .services-sticky{display:flex;flex-direction:column}.enhanced .service-art{display:block;position:absolute;inset:0;z-index:1;opacity:.12}.enhanced .service-panels{display:grid;perspective:1200px;transform-style:preserve-3d;position:relative;z-index:2;min-height:490px}
.enhanced .service-panel{grid-area:1/1;position:relative;width:46%;display:flex;flex-direction:column;justify-content:center;padding:32px 0;transform-origin:center}.enhanced .service-panel:nth-child(even){margin-left:54%}.enhanced .service-panel[aria-hidden=true]{visibility:hidden;pointer-events:none}.enhanced .services-bottom{position:relative;z-index:4;display:flex;justify-content:space-between;align-items:center;gap:24px}
.service-choices{display:flex;gap:8px;flex-wrap:wrap}.service-choices button{background:var(--background);border:1px solid var(--line);border-radius:30px;color:var(--pink);padding:12px 17px;min-height:44px;font-size:13px;transition:background .2s,color .2s}.service-choices button[aria-selected=true]{background:var(--pink);color:var(--background)}.service-choices button:hover{border-color:var(--pink)}.service-arrows{display:flex;align-items:center;gap:16px}.service-arrows button{display:grid;place-items:center;border:1px solid var(--line);width:44px;height:44px;border-radius:50%;background:var(--background);color:var(--pink)}.service-arrows button:disabled{opacity:.35}.service-arrows span{font-size:10px;letter-spacing:.08em}
.service-visual{position:relative;margin:25px 0;width:min(100%,520px);height:380px;border:1px solid #ffffff20;border-radius:18px;overflow:hidden;background:#19151a;box-shadow:0 24px 70px #0006;isolation:isolate}.enhanced .service-visual{position:absolute;left:119%;top:50%;width:98%;height:440px;max-height:90%;margin:0;transform:translateY(-50%) rotate(3deg)}.enhanced .service-panel:nth-child(even) .service-visual{left:auto;right:119%;transform:translateY(-50%) rotate(-3deg)}
.service-visual>img{width:100%;height:100%;object-fit:cover;display:block}.service-visual::after{content:'';position:absolute;inset:70% 0 0;background:linear-gradient(transparent,#09080be6);pointer-events:none}.service-visual figcaption{position:absolute;z-index:2;bottom:20px;left:20px;right:20px;color:#d9b7c7;font-size:12px}.visual-advertising>img{object-position:75% center}.visual-web>img{object-fit:contain}.visual-web{background:#ec619b20}
.method{padding:110px 7%;display:grid;grid-template-columns:1fr 1fr;gap:70px;perspective:1200px}.method .eyebrow{margin-bottom:32px}.method h2{font-size:clamp(40px,4.5vw,66px)}.method-steps article{display:flex;gap:30px;border-top:1px solid var(--line);padding:30px 0}.method-steps article>span{font-family:Georgia,serif;font-style:italic;font-size:36px}.method h3{font-size:25px;font-weight:400;letter-spacing:-.035em;margin:0 0 14px}.method p{margin:0;max-width:390px;color:var(--text)}
.contact{padding:95px 6% 110px;background:var(--pink);color:var(--background);text-align:center;border-radius:36px 36px 0 0;position:relative}.contact h2{font-size:clamp(72px,12vw,180px);margin:40px 0;line-height:.9}.email{display:inline-flex;align-items:center;gap:60px;padding:18px 28px;border:1px solid #0b0b0d80;border-radius:60px;font-size:22px;transition:background .2s}.email:hover{background:#0b0b0d12}.email-address{display:block;font-size:14px;margin-top:27px}
footer{background:var(--pink);color:var(--background);display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:24px;padding:35px 6%;border-top:1px solid #0b0b0d40;font-size:12px;line-height:1.6}footer img{filter:brightness(0);width:140px;height:auto}.instagram-link{font-size:14px;text-decoration:underline;text-underline-offset:5px}.contact a:focus-visible,footer a:focus-visible{outline-color:var(--background)}
.reveal-ready{opacity:0;transform:translate3d(0,45px,0);transition:opacity .85s,transform .85s}.reveal-ready.is-visible{opacity:1;transform:none}
@media(max-width:1000px){.service-arrows span{display:none}.service-choices{gap:5px}.service-choices button{padding:10px 12px}.studio{grid-template-columns:1fr;gap:35px;padding:80px 7%}.method{grid-template-columns:1fr;gap:45px;padding:80px 7%}}
@media(max-width:800px){.site-header{padding:18px 5%;min-height:80px}.brand img{width:95px}.site-header nav{gap:8px}.site-header .quote{font-size:12px;padding:11px 12px;min-height:44px;gap:8px}.site-header .quote svg{width:16px;height:16px}.enhanced .menu-toggle{display:block}.enhanced .nav-links{display:none;position:absolute;top:calc(100% - 4px);left:5%;right:5%;padding:16px 22px;background:#151216;border:1px solid var(--line);border-radius:12px;box-shadow:0 16px 30px #0008}.enhanced .menu-open .nav-links{display:flex;flex-direction:column;align-items:stretch;gap:0}.nav-links a{min-height:48px}.site-header:not(:has(.menu-toggle[aria-expanded])) .nav-links{flex-wrap:wrap}.service-panel h2{font-size:38px}.service-panel p{font-size:15px}.enhanced .service-visual{height:370px}}
@media(max-width:700px){body::before{background-size:auto 100%;background-position:35% center}.enhanced .service-art{display:none}.services-sticky{padding:28px 6%}.enhanced .service-panels{min-height:0;margin-bottom:22px}.enhanced .service-panel,.enhanced .service-panel:nth-child(even){width:100%;margin-left:0;padding:0;justify-content:flex-start}.enhanced .service-visual,.enhanced .service-panel:nth-child(even) .service-visual{position:relative;inset:auto;order:-1;transform:none;width:100%;height:190px;max-height:none;margin:0 0 22px;border-radius:12px;box-shadow:none}.service-visual>img{object-position:center 43%}.service-panel h2{font-size:clamp(32px,8vw,43px)}.service-panel .service-lead{font-size:24px;margin:15px 0 0}.service-panel p{font-size:14px;line-height:1.6;margin:15px 0;max-width:100%}.service-tags{font-size:11px;padding-top:13px}.enhanced .services-bottom{align-items:flex-start}.service-choices{gap:6px}.service-choices button{font-size:12px;padding:9px 12px}.service-arrows{gap:5px}.service-arrows button{width:44px;height:44px}.service-visual figcaption{bottom:12px;left:16px}.studio{padding:65px 6%}.studio h2{font-size:10vw}.studio-copy{grid-template-columns:1fr;gap:22px;margin-top:30px}.contact{border-radius:24px 24px 0 0;padding:65px 6%}.contact h2{font-size:20vw}.contact .eyebrow{font-size:10px}footer img{width:115px}.method-steps article{gap:22px}.method h3{font-size:23px}}
@media(max-width:380px){.brand img{width:74px}.site-header{gap:8px;padding-inline:4%}.site-header .quote{font-size:11px;padding-inline:9px}.site-header .quote span{display:none}.menu-toggle{padding-inline:9px}}
@media(pointer:coarse){.enhanced .service-art{display:none}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.reveal-ready{opacity:1;transform:none}.enhanced .service-art{display:none}*,*::before,*::after{scroll-behavior:auto;transition:none;animation:none}}
