@import url('https://fonts.googleapis.com/css2?family=Lato:ital,wght@0,400;0,700;0,900;1,400&family=Plus+Jakarta+Sans:ital,wght@0,500;0,700;0,900;1,500&display=swap');
:root { --latte:#f7f3ea; --matcha:#7c9a6b; --caramel:#c29b6e; --ink:#2e2a22; --hero:#222b1e; --cream:#f3efe4; --line:#ded5c4; --gutter:max(24px,6vw); --ease-out:cubic-bezier(.23,1,.32,1); }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { margin:0; background:var(--latte); color:var(--ink); font:16px/1.55 'Lato','Inter',sans-serif; overflow-x:hidden; }
a { color:inherit; }
nav, footer, section { padding-left:var(--gutter); padding-right:var(--gutter); }
:focus-visible { outline:3px solid var(--caramel); outline-offset:4px; }
.skip-link { position:fixed; z-index:100; top:12px; left:12px; transform:translateY(-160%); border-radius:8px; background:var(--cream); color:var(--hero); padding:12px 16px; font-weight:700; text-decoration:none; transition:transform .18s ease; }
.skip-link:focus { transform:translateY(0); }

.hero { position:relative; isolation:isolate; min-height:100svh; overflow:hidden; color:var(--cream); background:var(--hero); }
.hero-image, .hero-overlay { position:absolute; inset:0; width:100%; height:100%; }
.hero-image { z-index:-2; object-fit:cover; }
.hero-overlay { z-index:-1; background:linear-gradient(180deg,rgba(15,22,13,.7),rgba(20,29,17,.58) 42%,rgba(12,18,10,.94)); }
.hero-nav { position:relative; z-index:2; display:grid; align-items:center; width:calc(100% - (var(--gutter) * 2)); margin:18px auto 0; padding:14px 28px; border:1px solid rgba(243,239,228,.2); border-radius:999px; background:rgba(34,43,30,.45); box-shadow:0 16px 50px rgba(10,15,8,.24); backdrop-filter:blur(18px); -webkit-backdrop-filter:blur(18px); grid-template-columns:1fr auto 1fr; }
.brand { font:700 1.5rem 'Plus Jakarta Sans','Inter',sans-serif; text-decoration:none; }
.nav-links { display:flex; gap:26px; justify-self:center; }
.nav-links a, .page-nav a { text-decoration:none; }
.nav-links a { color:rgba(243,239,228,.82); transition:color .18s ease; }
.nav-links a:hover, .nav-links a:focus-visible, .nav-links a[aria-current="location"] { color:var(--cream); }
.button { display:inline-block; border:1px solid var(--matcha); border-radius:999px; background:var(--matcha); color:#fff; padding:13px 20px; font-weight:600; text-decoration:none; }
.hero-nav > .button { justify-self:end; }
.button-light,.project-cta,.contact-button { border-color:var(--cream); background:var(--cream); color:var(--hero); transition:background-color .18s ease,color .18s ease,border-color .18s ease; }
.button-light:hover,.button-light:focus-visible,.project-cta:hover,.project-cta:focus-visible,.contact-button:hover,.contact-button:focus-visible { border-color:var(--matcha); background:var(--matcha); color:var(--cream); }
.button-light:active,.project-cta:active,.contact-button:active { transform:scale(.98); transition:transform 120ms var(--ease-out); }
.button svg,.project-cta svg,.contact-button svg { width:18px; height:18px; fill:none; stroke:currentColor; stroke-width:1.8; stroke-linecap:round; stroke-linejoin:round; }
.nav-toggle,.nav-resume-mobile { display:none; }
.nav-resume-desktop,.nav-resume-mobile { align-items:center; gap:8px; }
.nav-resume-desktop { display:inline-flex; }
.nav-resume-desktop svg,.nav-resume-mobile svg { width:18px; height:18px; fill:none; stroke:currentColor; stroke-width:1.8; stroke-linecap:round; stroke-linejoin:round; }
.hero-copy { display:flex; position:relative; z-index:1; min-height:calc(100svh - 100px); padding:90px var(--gutter) 60px; flex-direction:column; align-items:flex-start; justify-content:center; text-align:left; }
.eyebrow { margin:0 0 16px; font-size:.73rem; font-weight:600; letter-spacing:.12em; text-transform:uppercase; }
.ink { color:var(--matcha); }
h1,h2,h3 { margin:.2em 0; font-family:'Plus Jakarta Sans','Inter',sans-serif; line-height:1.04; }
h1 { font-size:clamp(4rem,10vw,8rem); letter-spacing:-.065em; }
h1 em,h2 em { font-weight:500; }
.lede { max-width:min(760px,62vw); margin:28px 0 32px; font-size:clamp(1rem,1.45vw,1.25rem); line-height:1.55; }
.hero-link { position:relative; display:inline-flex; min-height:44px; align-items:center; gap:9px; border-bottom:1px solid rgba(243,239,228,.55); color:var(--cream); font-size:.88rem; letter-spacing:.06em; text-decoration:none; text-transform:uppercase; transition:color 160ms ease,transform 160ms var(--ease-out),text-shadow 160ms ease; }
.hero-link span { font-size:1.2rem; }
.hero-link:focus-visible { border-radius:3px; outline:3px solid var(--cream); outline-offset:5px; color:var(--matcha); text-shadow:1px 1px 0 #273120,2px 2px 0 #182014,3px 3px 5px rgba(0,0,0,.55); transform:translate(-2px,-2px); }
@media (hover:hover) and (pointer:fine) { .hero-link:hover { color:var(--matcha); text-shadow:1px 1px 0 #273120,2px 2px 0 #182014,3px 3px 5px rgba(0,0,0,.55); transform:translate(-2px,-2px); } }
.hero-avatar { position:absolute; z-index:1; right:max(50px,9vw); bottom:0; width:clamp(210px,24vw,380px); transform:translateY(35%); line-height:0; pointer-events:none; }
.hero-avatar img { width:100%; height:auto; }
.avatar-hover { position:absolute; inset:0; opacity:0; transition:opacity 160ms ease; }
@media (hover:hover) and (pointer:fine) { .hero-avatar { pointer-events:auto; } .hero-avatar:hover .avatar-hover { opacity:1; } .hero-avatar:hover .avatar-default { opacity:0; } }
.hero-location { position:absolute; bottom:30px; margin:0; color:rgba(243,239,228,.64); font-size:.7rem; letter-spacing:.12em; text-transform:uppercase; }
.trust { overflow:hidden; padding-top:72px; padding-bottom:82px; background:var(--cream); }
.trust-heading { max-width:1120px; margin:0 auto 42px; padding:0 var(--gutter); text-align:center; }
.trust-heading h2 { max-width:680px; margin:0 auto; font-size:clamp(2rem,4.5vw,4.2rem); letter-spacing:-.045em; }
.trust-marquee { overflow:visible; }
.trust-track { display:grid; width:100%; align-items:center; grid-template-columns:repeat(6,minmax(0,1fr)); gap:24px; }
.trust-track > img,.trust-logo-set img { display:block; width:100%; height:92px; min-width:0; object-fit:contain; object-position:center; }

.intro { max-width:1120px; margin:0; padding-top:155px; padding-bottom:155px; text-align:left; }
.intro h2 { font-size:clamp(2.6rem,6.1vw,5.8rem); letter-spacing:-.045em; }
.intro > p:last-child { max-width:690px; margin:40px 0 0; color:#756d60; font-size:1.15rem; }
.about { display:block; max-width:1120px; margin:0 auto; padding-top:145px; padding-bottom:145px; text-align:center; }
.about-heading { max-width:760px; margin:0 auto 55px; }
.about-heading h2 { font-size:clamp(2.8rem,6vw,5.5rem); letter-spacing:-.05em; }
.about-grid { display:grid; gap:18px; grid-template-columns:repeat(2,minmax(0,1fr)); }
.about-card { min-height:290px; border:1px solid var(--line); border-radius:22px; background:var(--latte); padding:28px; text-align:center; }
.about-icon { display:grid; width:58px; height:58px; margin:0 auto 30px; border-radius:18px; background:var(--matcha); color:var(--cream); place-items:center; font:700 2rem 'Plus Jakarta Sans','Inter',sans-serif; }
.about-card h3 { max-width:19ch; font-size:clamp(1.3rem,2.2vw,2rem); }
.about-card p { max-width:48ch; margin:18px 0 0; color:#756d60; font-size:1rem; }
.testimonials { padding-top:76px; padding-bottom:82px; background:var(--latte); text-align:center; }
.testimonials > h2 { max-width:600px; margin:0 auto 32px; font-size:clamp(2.3rem,4.5vw,4.2rem); letter-spacing:-.05em; }
.testimonial-grid { display:grid; gap:14px; grid-template-columns:repeat(2,minmax(0,1fr)); }
.testimonial-card { border:1px solid var(--line); border-radius:18px; background:var(--cream); padding:22px; text-align:left; }
.testimonial-card blockquote { margin:0 0 22px; font:400 1rem/1.55 'Lato','Inter',sans-serif; text-align:left; }
.testimonial-author { display:flex; align-items:center; gap:14px; }
.testimonial-author img { width:46px; height:46px; border-radius:50%; object-fit:cover; }
.testimonial-author p { margin:0; }
.testimonial-author p + p { margin-top:3px; color:#756d60; font-size:.85rem; }
.work { position:relative; width:100%; max-width:none; margin:0; padding-top:130px; padding-bottom:170px; overflow:hidden; background:var(--cream); }
.work::before { position:absolute; inset:0; opacity:.42; background-image:radial-gradient(#c9bfa8 1px,transparent 1px); background-size:34px 34px; content:""; pointer-events:none; }
.section-intro { position:relative; z-index:1; max-width:760px; margin:0 auto 90px; text-align:center; }
.section-intro h2 { font-size:clamp(3rem,7vw,6.5rem); letter-spacing:-.055em; }
.project-grid { position:relative; z-index:1; display:grid; max-width:1120px; margin:0 auto; grid-template-columns:repeat(2,minmax(0,1fr)); gap:26px; }
.project-card { position:relative; display:block; color:var(--ink); text-decoration:none; }
.project-card-2 { margin-top:70px; }
.project-card-3 { width:calc(100% - 10px); margin-top:-10px; }
.project-number { position:absolute; z-index:1; top:20px; right:20px; border:1px solid rgba(46,42,34,.16); border-radius:999px; background:rgba(247,243,234,.68); padding:4px 9px; font-size:.75rem; backdrop-filter:blur(8px); }
.cover-placeholder,.project-card img { display:grid; width:100%; aspect-ratio:4/5; border-radius:22px; background:linear-gradient(145deg,#d9cfba,#a9b99d); color:var(--ink); object-fit:cover; place-items:center; font-family:'Playfair Display',serif; font-size:1.65rem; transition:transform .35s var(--ease-out),box-shadow .35s var(--ease-out); }
.project-card-2 .cover-placeholder { background:linear-gradient(145deg,#ead9b8,#c29b6e); }
.project-card-3 .cover-placeholder { background:linear-gradient(145deg,#9aaf8e,#e5ded0); }
@media (hover:hover) and (pointer:fine) { .project-card:hover .cover-placeholder,.project-card:hover img { box-shadow:0 22px 42px rgba(75,63,42,.19); transform:translateY(-6px); } }
.project-meta { padding:16px 3px; text-align:center; }
.project-meta h3 { font-size:clamp(1.55rem,2.6vw,2.2rem); }
.project-meta p { margin:5px 0; color:#756d60; font-size:.84rem; }
.empty-work { position:relative; z-index:1; text-align:center; color:#756d60; }
.capabilities { padding-top:110px; padding-bottom:130px; background:var(--cream); }
.capability-list { display:grid; margin-top:36px; border-top:1px solid var(--line); grid-template-columns:repeat(2,1fr); }
.capability-list > span { padding:22px 0; border-bottom:1px solid var(--line); font:700 clamp(1.3rem,2vw,2rem) 'Plus Jakarta Sans','Inter',sans-serif; }
footer { position:relative; overflow:hidden; padding-top:32px; padding-bottom:28px; background:var(--hero); color:var(--cream); }
.footer-display { display:flex; width:100%; color:rgba(243,239,228,.09); font-family:'Plus Jakarta Sans','Inter',sans-serif; font-size:clamp(5rem,17vw,17rem); font-weight:900; letter-spacing:-.09em; line-height:.8; pointer-events:none; user-select:none; white-space:nowrap; }
.footer-content { display:flex; align-items:end; justify-content:space-between; gap:30px; margin-top:24px; }
.footer-content p { margin:0; color:#b9b7aa; font-size:.8rem; }
.socials { display:flex; gap:20px; }
.socials a { color:var(--cream); text-decoration:none; }

.page-nav { display:flex; align-items:center; justify-content:space-between; padding-top:28px; padding-bottom:24px; border-bottom:1px solid var(--line); }
.case-study { max-width:980px; margin:auto; padding:70px 24px; }
.case-hero h1 { font-size:clamp(3.3rem,8vw,6.5rem); }
.case-hero>img { width:100%; max-height:650px; margin-top:35px; border-radius:20px; object-fit:cover; }
.case-metadata { margin-top:54px; border-top:1px solid var(--line); }
.case-facts { display:grid; margin:0; border-bottom:1px solid var(--line); grid-template-columns:repeat(5,minmax(0,1fr)); }
.case-facts > div { min-width:0; padding:22px 18px 24px 0; }
.case-facts > div + div { border-left:1px solid var(--line); padding-left:18px; }
.case-facts dt,.case-impact .eyebrow { margin:0 0 6px; color:#756d60; font-size:.7rem; font-weight:700; letter-spacing:.12em; text-transform:uppercase; }
.case-facts dd { margin:0; font:700 1rem/1.3 'Plus Jakarta Sans','Inter',sans-serif; }
.case-detail { max-width:690px; padding-top:28px; }
.case-detail h2 { margin:0 0 7px; font-size:.85rem; letter-spacing:.08em; text-transform:uppercase; }
.case-detail p,.case-link { margin:0; }
.case-link { padding-top:28px; }
.case-link a { color:var(--matcha); font-weight:700; text-underline-offset:4px; }
.case-link span { margin-left:5px; }
.case-impact { max-width:690px; margin-top:32px; border-left:4px solid var(--matcha); background:#eee6d7; padding:23px 26px; }
.case-impact > p:last-child { margin:0; font:700 clamp(1.15rem,2vw,1.45rem)/1.35 'Plus Jakarta Sans','Inter',sans-serif; }
.case-section { padding:60px 0; border-bottom:1px solid var(--line); }
.case-section h2 { margin-bottom:20px; font-size:clamp(2rem,4vw,3.2rem); }
.prose { max-width:690px; font-size:1.05rem; }
.gallery { display:grid; margin-top:30px; gap:14px; grid-template-columns:repeat(2,1fr); }
.gallery img { width:100%; aspect-ratio:4/3; border-radius:12px; object-fit:cover; }
.js .reveal { opacity:0; transform:translateY(24px); transition:opacity .7s var(--ease-out),transform .7s var(--ease-out); }
.reveal.active { opacity:1; transform:translateY(0); }

@media(max-width:900px) { main .certificate-grid { grid-template-columns:repeat(2,minmax(0,1fr)); } main .testimonial-grid { grid-auto-columns:calc((100% - 24px) / 2); } }
@media(max-width:700px) { .trust-track { grid-template-columns:repeat(2,minmax(0,1fr)); gap:20px; } .hero-nav { width:calc(100% - 32px); margin-top:12px; padding:10px 12px; grid-template-columns:1fr auto; gap:8px; border-radius:20px; } .hero-nav .brand { display:flex; min-height:44px; align-items:center; justify-self:start; } .nav-toggle { display:flex; width:44px; height:44px; border:1px solid rgba(243,239,228,.3); border-radius:50%; background:transparent; flex-direction:column; align-items:center; justify-content:center; gap:4px; cursor:pointer; } .nav-toggle span { width:18px; height:1.5px; background:var(--cream); transition:transform .18s ease,opacity .18s ease; } .nav-toggle[aria-expanded="true"] span:first-child { transform:translateY(5.5px) rotate(45deg); } .nav-toggle[aria-expanded="true"] span:nth-child(2) { opacity:0; } .nav-toggle[aria-expanded="true"] span:last-child { transform:translateY(-5.5px) rotate(-45deg); } .nav-links { display:none; position:absolute; top:calc(100% + 8px); right:0; left:0; width:100%; padding:12px; border:1px solid rgba(243,239,228,.2); border-radius:20px; background:rgba(34,43,30,.97); box-shadow:0 16px 50px rgba(10,15,8,.3); flex-direction:column; gap:4px; backdrop-filter:blur(18px); -webkit-backdrop-filter:blur(18px); } .hero-nav.is-open .nav-links { display:flex; opacity:1; transform:translateY(0); }
.lede { max-width:100%; }
@media(max-width:700px) { .nav-links { opacity:0; transform:translateY(-6px); transition:opacity 180ms var(--ease-out),transform 180ms var(--ease-out); } } .nav-links a { display:flex; min-height:44px; align-items:center; padding:0 12px; } .hero-nav .nav-resume-desktop { display:none; } .hero-nav .nav-resume-mobile { display:inline-flex; width:max-content; margin-top:6px; justify-content:center; } .hero-copy { min-height:calc(100svh - 76px); padding-top:24px; justify-content:flex-start; } .hero-avatar { right:max(34px,8vw); width:clamp(150px,43vw,230px); } .trust { padding-top:56px; padding-bottom:64px; } .trust-heading { margin-bottom:30px; } .trust-track { gap:20px; }
.trust-track > img,.trust-logo-set img { width:100%; height:78px; flex-basis:auto; } .trust-track > img:nth-child(1),.trust-track > img:nth-child(2),.trust-track > img:nth-child(3),.trust-logo-set img:nth-child(1),.trust-logo-set img:nth-child(2),.trust-logo-set img:nth-child(3) { transform:scale(1.1); } .intro,.work { padding-top:100px; padding-bottom:100px; } .section-intro { margin-bottom:55px; } .project-grid,.about { grid-template-columns:1fr; } .project-card-2,.project-card-3 { width:auto; margin-top:0; } .about { padding-top:90px; padding-bottom:90px; } .footer-content { align-items:start; flex-direction:column-reverse; } .socials { flex-wrap:wrap; } .case-facts { grid-template-columns:1fr; } .case-facts > div,.case-facts > div + div { border-left:0; border-bottom:1px solid var(--line); padding:16px 0; } .case-facts > div:last-child { border-bottom:0; } .case-detail { padding-top:24px; } .gallery { grid-template-columns:1fr; } }
@media(prefers-reduced-motion:reduce) { html { scroll-behavior:auto; } .reveal { opacity:1; transform:none; transition:none; } main .certificate-card,main .certificate-card h3,main .certificate-card p { transition:none; } }
@media(prefers-reduced-motion:reduce) { .hero-link { transition:none; } .hero-link:hover,.hero-link:focus-visible { transform:none; } }

/* Portfolio surfaces below hero use an Umia-inspired dark system. Hero remains unchanged. */
main { --surface:#111; --surface-raised:#191919; --surface-muted:#242424; --text-primary:#f4f1ea; --text-secondary:#c5c2bb; --text-tertiary:#92908a; --accent:#8abd6a; --border:rgba(244,241,234,.14); background:var(--surface); color:var(--text-primary); }
main .ink { color:var(--accent); }
main .work,main .trust,main .testimonials,main .capabilities { background:var(--surface); }
main .work { padding-top:96px; padding-bottom:104px; }
main .work::before { opacity:.14; background-image:radial-gradient(rgba(244,241,234,.42) 1px,transparent 1px); background-size:32px 32px; }
main .section-intro { max-width:none; margin:0 0 64px; text-align:left; }
main .work .section-intro { text-align:left; }
main .section-intro h2,main .trust-heading h2,main .testimonials > h2,main .about-heading h2 { color:var(--text-primary); }
main .project-grid { width:100vw; max-width:none; margin:0 calc(var(--gutter) * -1); gap:0; grid-template-columns:1fr; }
main .project-card { position:relative; display:grid; min-height:clamp(280px,28vw,360px); overflow:hidden; border-radius:0; color:var(--text-primary); isolation:isolate; }
main .project-card::after { content:""; position:absolute; z-index:-1; inset:0; background:linear-gradient(90deg,rgba(8,12,7,.92) 0%,rgba(8,12,7,.68) 45%,rgba(8,12,7,.16) 78%),linear-gradient(0deg,rgba(8,12,7,.72),transparent 55%); }
main .project-card-2,main .project-card-3 { width:auto; margin-top:0; }
main .project-number { z-index:2; border-color:rgba(244,241,234,.28); background:rgba(17,17,17,.66); color:var(--text-primary); }
main .cover-placeholder,main .project-card img { position:absolute; z-index:-2; inset:0; width:100%; height:100%; aspect-ratio:auto; border-radius:0; background:var(--surface-raised); object-fit:cover; transition:transform .5s var(--ease-out); }
@media (hover:hover) and (pointer:fine) { main .project-card:hover .cover-placeholder,main .project-card:hover img { box-shadow:none; transform:scale(1.035); } }
main .project-meta { display:flex; position:relative; z-index:1; width:min(620px,75%); padding:clamp(30px,5vw,64px) var(--gutter); border:0; flex-direction:column; align-items:flex-start; justify-content:flex-end; gap:0; text-align:left; }
main .project-meta h3 { margin:0; color:var(--text-primary); font-size:clamp(2.2rem,5vw,4.8rem); }
main .project-meta p { margin:12px 0 26px; color:var(--text-secondary); font-size:.82rem; font-weight:600; letter-spacing:.1em; text-transform:uppercase; }
main .project-cta { display:inline-flex; min-height:44px; align-items:center; gap:8px; padding:10px 18px; font-weight:700; }
main .empty-work { color:var(--text-tertiary); }
main .about { max-width:none; margin:0; padding-top:96px; padding-bottom:96px; background:var(--surface-raised); text-align:left; }
main .about-heading { max-width:760px; margin:0 0 56px; }
main .about-grid { max-width:none; margin:0; gap:18px; border-top:0; grid-template-columns:repeat(4,minmax(0,1fr)); }
@media(max-width:1100px) { main .about-grid { grid-template-columns:repeat(2,minmax(0,1fr)); } }
main .about-card { display:flex; min-height:420px; flex-direction:column; align-items:center; border:1px solid var(--border); border-radius:22px; background:var(--surface); padding:28px; text-align:center; transition:background-color .2s ease, color .2s ease, transform .2s ease; }
main .about-card:hover { border-top-color:var(--border); background:#1d2a1d; transform:translateY(-4px); }
main .about-card:nth-child(odd),main .about-card:nth-child(even) { padding-left:28px; padding-right:28px; border-left:1px solid var(--border); }
main .about-icon,main .service-card img { display:block; width:256px; max-width:100%; height:auto; margin:0 0 32px; border-radius:0; background:transparent; object-fit:contain; }
main .about-card h3 { max-width:23ch; color:var(--text-primary); }
main .about-card p { margin-inline:auto; color:var(--text-secondary); }
main .about-card:hover h3,main .about-card:hover p { color:var(--cream); }
main .trust { padding-top:88px; padding-bottom:88px; border-top:1px solid var(--border); }
main .trust-heading { max-width:760px; margin:0 0 48px; padding:0; text-align:left; }
main .trust-heading h2 { max-width:15ch; margin:0; }
main .trust-track { gap:40px; will-change:transform; }
main .trust-logo-set { gap:40px; }
main .trust-track > img,main .trust-logo-set img { filter:none; opacity:1; }
main .testimonials { padding-top:88px; padding-bottom:96px; border-top:1px solid var(--border); text-align:left; }
main .testimonials > h2 { max-width:15ch; margin:0 0 48px; }
main .testimonial-grid { display:grid; grid-auto-columns:calc((100% - 96px) / 5); grid-auto-flow:column; align-items:start; gap:24px; overflow-x:auto; border-top:0; padding:0 0 18px; scroll-snap-type:x mandatory; scrollbar-width:thin; scrollbar-color:var(--accent) transparent; }
main .testimonial-card { display:flex; align-self:start; min-width:0; border:0; border-top:1px solid var(--border); border-radius:12px; background:var(--surface-raised); padding:28px; flex-direction:column; scroll-snap-align:start; transition:background-color 200ms var(--ease-out),border-top-color 200ms var(--ease-out),transform 200ms var(--ease-out); }
main .testimonial-card blockquote { margin:0; max-width:none; }
main .testimonial-author { margin-top:24px; }
main .testimonial-card:nth-child(odd),main .testimonial-card:nth-child(even) { padding-right:0; padding-left:0; border-left:0; }
@media (hover:hover) and (pointer:fine) { main .testimonial-card:hover { border-top-color:var(--accent); background:#1d2a1d; transform:translateY(-4px); } }
main .testimonial-card:nth-child(odd),main .testimonial-card:nth-child(even) { padding-right:28px; padding-left:28px; border-left:1px solid var(--border); }
main .testimonial-card blockquote { max-width:48ch; color:var(--text-primary); font-size:1.08rem; line-height:1.65; }
main .testimonial-author p + p { color:var(--text-tertiary); }
main .capabilities { max-width:none; margin:0; padding-top:96px; padding-bottom:96px; border-top:0; background:var(--surface-raised); text-align:left; }
main .capabilities > h2 { max-width:760px; margin:0 0 56px; color:var(--text-primary); font-size:clamp(2.8rem,6vw,5.5rem); letter-spacing:-.05em; }
main .capability-list { max-width:none; margin:0; border:0; gap:18px; grid-template-columns:repeat(4,minmax(0,1fr)); }
main .service-card { display:flex; min-height:420px; flex-direction:column; align-items:center; border:1px solid var(--border); border-radius:22px; background:var(--surface); padding:28px; text-align:center; transition:background-color .2s ease,color .2s ease,transform .2s ease; }
main .service-card + .service-card { border-left:1px solid var(--border); }
main .service-card img { display:block; width:256px; max-width:100%; height:auto; margin:0 0 32px; background:transparent; object-fit:contain; }
main .service-card h3 { max-width:23ch; margin:.2em auto; color:var(--text-primary); text-align:center; }
main .service-tags { display:flex; flex-wrap:wrap; justify-content:center; gap:8px; width:100%; margin-top:18px; text-align:center; }
main .service-tags span { display:inline-flex; align-items:center; justify-content:center; border:1px solid var(--matcha); border-radius:999px; color:var(--matcha); padding:5px 11px; font-size:.75rem; font-weight:700; line-height:1.2; text-align:center; }
main .service-card:hover { background:#1d2a1d; transform:translateY(-4px); }
main .service-card:hover h3 { color:var(--cream); }
@media(max-width:1100px) { main .capability-list { grid-template-columns:repeat(2,minmax(0,1fr)); } }
main .experience-tabs,main .experience-panel { width:100%; }
main .experience-tabs { display:flex; margin:64px 0 0; border-bottom:1px solid var(--border); }
main .experience-tab { min-height:48px; padding:12px 20px; border:0; border-bottom:2px solid transparent; background:transparent; color:var(--text-secondary); font:inherit; cursor:pointer; }
main .experience-tab:hover,main .experience-tab:focus-visible { color:var(--text-primary); }
main .experience-tab.is-active { border-bottom-color:var(--accent); color:var(--accent); }
main .experience-panel { padding-top:28px; opacity:1; transform:translateY(0); transition:opacity 180ms var(--ease-out),transform 180ms var(--ease-out); }
main .experience-panel[hidden] { display:none; }
main .experience-panel.is-active { animation:experience-panel-in 180ms var(--ease-out); }
@keyframes experience-panel-in { from { opacity:0; transform:translateY(6px); } to { opacity:1; transform:translateY(0); } }
main .experience-list { width:100%; border-top:1px solid var(--border); }
main .experience-item { display:grid; grid-template-columns:minmax(220px,.35fr) 1fr minmax(220px,.4fr); gap:24px; align-items:baseline; padding:24px 0; border-bottom:1px solid var(--border); }
main .experience-item p,main .experience-item h4 { margin:0; }
main .experience-date { color:var(--text-tertiary); font-size:.78rem; font-weight:700; letter-spacing:.08em; text-transform:uppercase; }
main .experience-item h4 { color:var(--text-primary); font:700 clamp(1.25rem,2.2vw,1.8rem)/1.04 'Plus Jakarta Sans','Inter',sans-serif; }
main .experience-item > p:last-child { color:var(--text-secondary); }
main .certificates { padding:96px var(--gutter); border-top:1px solid var(--border); background:var(--surface-raised); }
main .certificates > h2 { max-width:760px; margin:0 0 48px; color:var(--text-primary); font-size:clamp(2.6rem,6vw,5.2rem); letter-spacing:-.05em; }
main .certificate-grid { display:grid; width:100%; max-width:none; margin:0; gap:24px; grid-template-columns:repeat(3,minmax(0,1fr)); }
main .certificate-card { overflow:hidden; border:1px solid var(--border); border-radius:22px; background:var(--surface); transition:background-color .2s ease, color .2s ease, transform .2s ease; }
main .certificate-card img { display:block; width:100%; aspect-ratio:4/3; object-fit:cover; }
main .certificate-card h3,main .certificate-card p { transition:color .2s ease; }
@media (hover:hover) and (pointer:fine) { main .certificate-card:hover { border-top-color:var(--border); background:#1d2a1d; transform:translateY(-4px); } main .certificate-card:hover h3,main .certificate-card:hover p { color:var(--cream); } }
main .certificate-card > div { padding:22px; }
main .certificate-card h3 { margin:0; color:var(--text-primary); font-size:clamp(1.25rem,2vw,1.7rem); }
main .certificate-card p { margin:10px 0 0; color:var(--text-secondary); font-size:.9rem; }
main .contact { padding:112px var(--gutter) 120px; border-top:1px solid var(--border); background:var(--surface); }
main .contact h2 { max-width:760px; margin:0 0 24px; color:var(--text-primary); font-size:clamp(2.8rem,6vw,5.8rem); letter-spacing:-.055em; }
main .contact > p:not(.eyebrow) { max-width:46ch; margin:0; color:var(--text-secondary); font-size:1.1rem; }
main .contact-links { display:flex; flex-wrap:wrap; gap:12px 28px; margin-top:36px; }
main .contact-links a { display:inline-flex; min-height:44px; align-items:center; color:var(--accent); font-weight:700; text-underline-offset:5px; }
main .contact-links a.contact-button { gap:8px; color:var(--hero); text-decoration:none; }
main .contact-links a.contact-button:hover,main .contact-links a.contact-button:focus-visible { color:var(--cream); }
.admin-project-card:not(:has(.admin-project-cover)) { grid-template-columns:1fr; }
.admin-project-cover { aspect-ratio:4/3; min-height:0; }
.admin-project-cover img { display:block; }
@media(max-width:700px) { main .work,main .about,main .trust,main .testimonials,main .capabilities { padding-top:64px; padding-bottom:64px; } main .section-intro { margin-bottom:48px; } main .project-card-2,main .project-card-3 { margin-top:0; } main .project-card { min-height:300px; }
main .project-card::after { background:linear-gradient(0deg,rgba(8,12,7,.94) 0%,rgba(8,12,7,.55) 62%,rgba(8,12,7,.2)); }
main .project-meta { display:flex; width:100%; padding:24px; } main .about-card:nth-child(odd),main .about-card:nth-child(even) { padding-right:0; padding-left:0; border-left:0; }
main .experience-tabs { margin-top:44px; overflow-x:auto; }
main .experience-tab { flex:1 0 auto; padding-inline:14px; }
main .experience-item { display:block; padding:20px 0; }
main .experience-item h3 { margin:8px 0 5px; }
main .certificate-grid { grid-template-columns:1fr; }
main .certificates,main .contact { padding-top:64px; padding-bottom:72px; }
main .certificates > h2,main .contact h2 { margin-bottom:32px; }
main .certificate-grid { gap:16px; }
main .certificate-card > div { padding:20px; }
main .contact-links { display:flex; gap:8px; }
main .contact-links a { width:auto; }
main .about-card:nth-child(odd),main .about-card:nth-child(even) { padding:24px; border-left:1px solid var(--border); }
main .testimonial-card:nth-child(odd),main .testimonial-card:nth-child(even) { padding-right:0; padding-left:0; border-left:0; } main .about-icon { margin-bottom:28px; } main .testimonial-grid { grid-template-columns:none; }
main .testimonial-grid { grid-auto-columns:min(82vw,300px); grid-auto-flow:column; align-items:start; gap:16px; overflow-x:auto; overscroll-behavior-x:contain; padding:0 0 18px; scroll-snap-type:x mandatory; -webkit-overflow-scrolling:touch; } main .testimonial-card { width:auto; min-height:0; height:auto; } main .testimonial-card blockquote { display:block; } main .testimonial-card .testimonial-author { margin-top:16px; padding-top:0; }
main .capability-list { grid-template-columns:1fr; } main .capability-list > span + span { padding-left:0; border-left:0; } main .service-tags { justify-content:center; } main .service-tags span { width:fit-content; max-width:100%; padding-inline:16px; text-align:center; } main .service-card + .service-card { border-left:1px solid var(--border); } }


/* CMS editor uses existing color and typography system. */
.project-editor { max-width:none; margin:0; padding-left:var(--gutter); padding-right:var(--gutter); }
.editor-header { margin-bottom:34px; padding-bottom:28px; border-bottom:1px solid var(--line); }
.editor-header-row { display:flex; align-items:end; justify-content:space-between; gap:24px; }
.editor-header h1 { font-size:clamp(2.8rem,6vw,5rem); letter-spacing:-.055em; }
.editor-status,.field-help { margin:7px 0 0; color:#756d60; font-size:.88rem; }
.editor-preview { color:var(--matcha); font-size:.9rem; font-weight:700; text-underline-offset:4px; white-space:nowrap; }
.form-status { margin:0 0 28px; border:1px solid #a9c199; border-radius:10px; background:#eaf1e3; padding:13px 16px; color:#345329; font-weight:600; }
.form-error-summary { margin:0 0 28px; border:1px solid #d6a49a; border-radius:10px; background:#fff0eb; padding:13px 16px; color:#7b3027; font-weight:600; }
.form-error-summary p,.form-error-summary ul { margin:0; }
.form-error-summary ul { padding-left:20px; }
.field-error { margin:7px 0 0; color:#7b3027; font-size:.88rem; font-weight:600; }
.editor-form { width:100%; }
.editor-form > fieldset,.editor-sections { width:100%; min-width:0; margin:0 0 28px; border:1px solid var(--line); border-radius:12px; background:rgba(243,239,228,.54); padding:clamp(22px,4vw,36px); }
.editor-form > fieldset > legend,.editor-sections > legend { padding:0 8px; color:var(--hero); font:700 clamp(1.4rem,2.4vw,2rem) 'Plus Jakarta Sans','Inter',sans-serif; }
.editor-grid { display:grid; gap:20px; grid-template-columns:repeat(2,minmax(0,1fr)); }
.form-field { min-width:0; }
.form-field-wide { grid-column:1 / -1; }
.form-field label { display:block; margin-bottom:7px; font-weight:700; }
.form-field input:not([type="file"]),.form-field textarea,.form-field select { width:100%; min-height:44px; border:1px solid #c9bfae; border-radius:10px; background:#fffdf8; color:var(--ink); padding:10px 12px; font:inherit; }
.form-field textarea { display:block; min-height:110px; resize:vertical; }
.form-field input[type="file"] { width:100%; min-height:44px; border:1px dashed #b7aa94; border-radius:10px; background:#fffdf8; padding:9px 12px; font:inherit; }
.form-field input[type="file"]::file-selector-button { min-height:28px; margin-right:10px; border:0; border-radius:6px; background:#e7edde; color:#345329; padding:4px 9px; font:inherit; font-weight:700; }
.form-field input:not([type="file"]):focus,.form-field textarea:focus,.form-field select:focus,.form-field input[type="file"]:focus { border-color:var(--matcha); outline:3px solid rgba(124,154,107,.24); outline-offset:1px; }
.format-toolbar { display:flex; flex-wrap:wrap; align-items:center; gap:6px; margin-bottom:8px; }
.format-toolbar button { min-width:38px; min-height:38px; border:1px solid rgba(244,241,234,.2); border-radius:7px; background:#242424; color:#f4f1ea; padding:6px 10px; font:inherit; cursor:pointer; }
.format-toolbar button:hover,.format-toolbar button:focus-visible { border-color:#8abd6a; background:#2d3829; }
.format-toolbar > span { width:1px; height:26px; margin:0 3px; background:rgba(244,241,234,.2); }
.prose p { white-space:pre-line; }
.prose ul,.prose ol { margin:1em 0; padding-left:1.5em; }
.prose li + li { margin-top:.4em; }
.editor-actions { position:sticky; z-index:2; bottom:18px; margin-top:4px; padding:14px; border:1px solid var(--line); border-radius:12px; background:rgba(247,243,234,.94); box-shadow:0 10px 25px rgba(75,63,42,.1); text-align:right; backdrop-filter:blur(10px); }
.editor-actions .button,.editor-section .button { min-height:44px; cursor:pointer; }
.editor-sections { margin-top:74px; }
.editor-sections > header { margin-bottom:12px; }
.editor-sections-header,.editor-section-heading,.editor-section-order { display:flex; align-items:center; }
.editor-sections-header,.editor-section-heading { justify-content:space-between; gap:20px; }
.editor-section-order { flex-wrap:wrap; gap:8px; }
.editor-sections h2 { font-size:clamp(2.4rem,5vw,4rem); letter-spacing:-.05em; }
.editor-section { padding:38px 0; }
.editor-section h3 { margin-bottom:20px; font-size:clamp(1.5rem,3vw,2.2rem); }
.editor-section form { display:grid; gap:20px; }
.editor-section form .button { justify-self:start; }
.editor-section-order form,.editor-section-delete { display:block; }
.admin-secondary-action { min-height:44px; border:1px solid #c9bfae; border-radius:8px; background:transparent; color:inherit; padding:8px 12px; font:inherit; font-weight:700; cursor:pointer; }
.editor-section-add { margin-top:20px; border-top:2px solid var(--matcha); }

@media(max-width:700px) { .project-editor { padding-top:42px; padding-bottom:52px; } .editor-header-row,.editor-sections-header,.editor-section-heading { align-items:start; flex-direction:column; } .editor-grid { grid-template-columns:1fr; } .form-field-wide { grid-column:auto; } .editor-actions { bottom:10px; text-align:stretch; } .editor-actions .button { width:100%; } .editor-sections { margin-top:58px; } .editor-section { padding:30px 0; } }

/* CMS dashboard: shared matcha-latte styling, separate from editor controls. */
.admin-login { max-width:none; margin:0; padding-left:var(--gutter); padding-right:var(--gutter); }
.admin-login form { display:grid; max-width:420px; gap:9px; }
.admin-login label { font-weight:700; }
.admin-login input { min-height:44px; border:1px solid #c9bfae; border-radius:10px; background:#fffdf8; color:var(--ink); padding:10px 12px; font:inherit; }
.admin-login input:focus { border-color:var(--matcha); outline:3px solid rgba(124,154,107,.24); outline-offset:1px; }
.admin-login form p { margin:10px 0 0; }
.admin-error { max-width:420px; margin:20px 0; border:1px solid #d6a49a; border-radius:10px; background:#fff0eb; padding:12px 14px; color:#7b3027; font-weight:600; }
.admin-dashboard { max-width:none; margin:0; padding-left:var(--gutter); padding-right:var(--gutter); }
.admin-dashboard-header { display:flex; margin-bottom:38px; padding-bottom:28px; border-bottom:1px solid var(--line); align-items:end; justify-content:space-between; gap:24px; }
.admin-header-actions { display:flex; flex-wrap:wrap; gap:10px; }
.admin-delete { display:inline-flex; min-height:44px; margin-top:6px; border:0; background:none; color:#7b3027; padding:10px 0; align-items:center; font:inherit; font-weight:700; text-decoration:underline; text-underline-offset:4px; cursor:pointer; }
.admin-dashboard h1 { font-size:clamp(2.8rem,6vw,5rem); letter-spacing:-.055em; }
.admin-project-list { display:grid; margin:0; padding:0; gap:18px; list-style:none; }
.admin-project-card { display:grid; overflow:hidden; border:1px solid var(--line); border-radius:14px; background:rgba(243,239,228,.54); grid-template-columns:minmax(170px,28%) 1fr; }
.admin-project-cover { display:grid; min-height:190px; background:linear-gradient(145deg,#d9cfba,#a9b99d); color:#5d6654; place-items:center; text-align:center; }
.admin-project-cover img { width:100%; height:100%; object-fit:cover; }
.admin-project-cover span { max-width:12ch; font:700 1rem 'Plus Jakarta Sans','Inter',sans-serif; }
.admin-project-details { padding:24px; }
.admin-project-details .eyebrow { margin-bottom:9px; }
.admin-project-details h2 { font-size:clamp(1.6rem,3vw,2.35rem); letter-spacing:-.035em; }
.admin-project-status,.admin-project-updated { margin:7px 0; color:#756d60; }
.admin-project-status { font-weight:700; }
.admin-project-updated { font-size:.9rem; }
.admin-project-edit { display:inline-block; margin-top:12px; color:#345329; font-weight:700; text-underline-offset:4px; }
.admin-empty { margin:0; color:#756d60; }
.admin-summary { display:grid; margin-bottom:28px; gap:12px; grid-template-columns:repeat(6,minmax(0,1fr)); }
.admin-summary a,.admin-dashboard-section { border:1px solid rgba(244,241,234,.14); background:#191919; }
.admin-summary a { display:flex; min-height:132px; padding:20px; flex-direction:column; justify-content:flex-end; color:#f4f1ea; text-decoration:none; transition:border-color .18s ease,background-color .18s ease; }
.admin-summary a:hover,.admin-summary a:focus-visible { border-color:#8abd6a; background:#1d2a1d; }
.admin-summary strong { font:700 clamp(2rem,4vw,3.5rem)/1 'Plus Jakarta Sans','Inter',sans-serif; }
.admin-summary span { margin-top:8px; color:#c5c2bb; font-weight:700; }
.admin-summary small { margin-top:7px; color:#8abd6a; font-weight:700; }
.admin-dashboard-grid { display:grid; gap:18px; grid-template-columns:repeat(2,minmax(0,1fr)); }
.admin-dashboard-section { padding:26px; }
.admin-dashboard-section h2 { margin:0 0 20px; color:#f4f1ea; font-size:1.25rem; }
.admin-quick-actions { display:flex; flex-wrap:wrap; gap:10px; }
.admin-alert-list,.admin-recent-list { margin:0; padding:0; list-style:none; }
.admin-alert-list li + li,.admin-recent-list li + li { border-top:1px solid rgba(244,241,234,.14); }
.admin-alert-list a,.admin-recent-list a { display:flex; min-height:58px; padding:13px 0; color:#f4f1ea; text-decoration:none; flex-direction:column; justify-content:center; gap:3px; }
.admin-alert-list a:hover strong,.admin-alert-list a:focus-visible strong,.admin-recent-list a:hover strong,.admin-recent-list a:focus-visible strong { color:#8abd6a; }
.admin-alert-list span,.admin-recent-list span { color:#c5c2bb; font-size:.9rem; }
.admin-recent { margin-top:18px; }
@media(max-width:900px) { .admin-summary { grid-template-columns:repeat(3,minmax(0,1fr)); } }
@media(max-width:700px) { .admin-summary,.admin-dashboard-grid { grid-template-columns:1fr; } .admin-summary a { min-height:104px; } .admin-dashboard-section { padding:20px; } }

@media(max-width:700px) { .admin-dashboard-header { align-items:start; flex-direction:column; } .admin-project-card { grid-template-columns:1fr; } .admin-project-cover { min-height:180px; max-height:300px; } .editor-preview,.admin-project-edit { display:inline-flex; min-height:44px; align-items:center; } }

/* Case studies share homepage dark surfaces and viewport padding. */
body:has(.case-hero) { background:#111; color:#f4f1ea; }
body:has(.case-hero) .page-nav { border-color:rgba(244,241,234,.14); background:#111; }
body:has(.case-hero) .case-study { max-width:none; margin:0; padding:88px var(--gutter) 104px; color:#f4f1ea; }
body:has(.case-hero) .case-hero { max-width:none; }
body:has(.case-hero) .case-hero h1 { color:#f4f1ea; }
body:has(.case-hero) .case-hero .lede { color:#c5c2bb; }
body:has(.case-hero) .case-hero>img { width:100%; max-height:560px; margin-top:35px; border-radius:0; object-fit:cover; }
body:has(.case-hero) .case-metadata { border-color:rgba(244,241,234,.14); }
body:has(.case-hero) .case-facts { border-color:rgba(244,241,234,.14); }
body:has(.case-hero) .case-facts>div+div { border-color:rgba(244,241,234,.14); }
body:has(.case-hero) .case-facts dt,body:has(.case-hero) .case-impact .eyebrow { color:#92908a; }
body:has(.case-hero) .case-detail h2,body:has(.case-hero) .case-section h2 { color:#f4f1ea; }
body:has(.case-hero) .case-link a { color:#8abd6a; }
body:has(.case-hero) .case-impact { border-left-color:#8abd6a; background:#191919; }
body:has(.case-hero) .case-section { border-color:rgba(244,241,234,.14); }
body:has(.case-hero) .case-detail,body:has(.case-hero) .prose { max-width:920px; font-size:1.12rem; line-height:1.7; }
body:has(.case-hero) .case-section h2 { font-size:clamp(2.4rem,5vw,4.2rem); }
body:has(.case-hero) .case-detail h2 { font-size:1rem; }

/* CMS uses portfolio dark surfaces and accessible controls. */
body:has(.admin-login),body:has(.admin-dashboard),body:has(.project-editor) { background:#111; color:#f4f1ea; }
body:has(.admin-login) .page-nav,body:has(.admin-dashboard) .page-nav,body:has(.project-editor) .page-nav { border-color:rgba(244,241,234,.14); background:#111; }
body:has(.admin-login) .case-study,body:has(.admin-dashboard) .case-study,body:has(.project-editor) .case-study { color:#f4f1ea; }
.editor-header,.admin-dashboard-header { border-color:rgba(244,241,234,.14); }
.editor-status,.field-help,.admin-project-status,.admin-project-updated,.admin-empty { color:#c5c2bb; }
.editor-preview,.admin-project-edit { color:#8abd6a; }
.form-status { border-color:rgba(138,189,106,.55); background:#1d2a1d; color:#d9efcb; }
.form-error-summary,.admin-error { border-color:rgba(218,128,112,.62); background:#321d1a; color:#ffd8d0; }
.field-error,.admin-delete { color:#ffafa2; }
.editor-form > fieldset,.editor-sections,.admin-project-card { border-color:rgba(244,241,234,.14); background:#191919; }
.editor-form > fieldset > legend,.editor-sections > legend { color:#f4f1ea; }
.form-field input:not([type="file"]),.form-field textarea,.form-field select,.form-field input[type="file"],.admin-login input { border-color:rgba(244,241,234,.2); background:#242424; color:#f4f1ea; }
.form-field input[type="file"]::file-selector-button { background:#8abd6a; color:#111; }
.form-field input:not([type="file"]):focus,.form-field textarea:focus,.form-field select:focus,.form-field input[type="file"]:focus,.admin-login input:focus { border-color:#8abd6a; outline-color:rgba(138,189,106,.38); }
.editor-actions { border-color:rgba(244,241,234,.14); background:rgba(25,25,25,.94); box-shadow:0 10px 25px rgba(0,0,0,.28); }
.admin-project-cover { background:linear-gradient(145deg,#242424,#1d2a1d); color:#c5c2bb; }
:focus-visible { outline-color:#8abd6a; }

.sr-only { position:absolute; width:1px; height:1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; }
.site-logo { display:block; max-width:100%; object-fit:contain; }
.site-logo-header { width:auto; height:44px; }
.site-logo-footer { width:min(72vw,760px); height:auto; max-height:150px; margin:0; opacity:.9; object-position:left center; }
.admin-sidebar { position:fixed; z-index:10; inset:0 auto 0 0; display:flex; width:248px; border-right:1px solid rgba(244,241,234,.14); background:#151515; color:#f4f1ea; padding:24px 14px; flex-direction:column; }
.admin-sidebar-brand { display:flex; min-height:64px; align-items:center; padding:0 12px; color:#f4f1ea; font:700 1.5rem 'Plus Jakarta Sans','Inter',sans-serif; text-decoration:none; }
.admin-sidebar-brand img { display:block; width:auto; max-width:100%; height:56px; object-fit:contain; }
.admin-sidebar-links { display:grid; margin-top:34px; gap:4px; }
.admin-sidebar-links a,.admin-sidebar-signout { display:flex; min-height:44px; align-items:center; gap:12px; border-radius:8px; color:#c5c2bb; padding:10px 12px; font-weight:700; text-decoration:none; }
.admin-sidebar-links a:hover,.admin-sidebar-links a:focus-visible,.admin-sidebar-links a.is-active,.admin-sidebar-signout:hover,.admin-sidebar-signout:focus-visible { background:#293426; color:#f4f1ea; }
.admin-sidebar-links a.is-active { box-shadow:inset 3px 0 #8abd6a; color:#d9efcb; }
.admin-sidebar svg { width:20px; height:20px; flex:0 0 20px; }
.admin-sidebar-signout { margin-top:auto; color:#ffafa2; }
.admin-sidebar form { margin-top:auto; } .admin-sidebar-signout { width:100%; border:0; background:transparent; font:inherit; text-align:left; cursor:pointer; }
@media(max-width:480px) { main .testimonial-card blockquote { max-height:none; padding-right:0; } }
.admin-main { min-height:100svh; margin-left:248px; }
.branding-preview { display:grid; min-height:120px; margin-bottom:18px; border:1px dashed rgba(244,241,234,.24); border-radius:10px; background:#111; padding:18px; place-items:center; }
.branding-preview img { display:block; max-width:min(100%,460px); max-height:120px; object-fit:contain; }
.branding-preview span { color:#f4f1ea; font:700 2rem 'Plus Jakarta Sans','Inter',sans-serif; }
.branding-remove { display:flex !important; width:max-content; min-height:44px; margin-top:10px; align-items:center; gap:8px; font-weight:400 !important; }
@media(max-width:700px) { .site-logo-header { height:36px; } .site-logo-footer { width:min(86vw,520px); max-height:96px; } .admin-sidebar { position:relative; width:100%; height:auto; min-height:0; border-right:0; border-bottom:1px solid rgba(244,241,234,.14); padding:10px 16px; flex-direction:column; align-items:stretch; gap:8px; overflow:visible; } .admin-sidebar-brand { padding:0 4px; } .admin-sidebar-links { display:grid; margin:0; grid-template-columns:repeat(2,minmax(0,1fr)); gap:4px; } .admin-sidebar-links a,.admin-sidebar-signout { min-width:0; min-height:44px; padding:10px; } .admin-sidebar-links a span,.admin-sidebar-signout span { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; } .admin-sidebar-signout { margin:0; } .admin-main { margin-left:0; } }
@media(max-width:480px) { :root { --gutter:16px; } html { scroll-padding-top:16px; } body { font-size:16px; overflow-wrap:anywhere; } img,svg,video { max-width:100%; } .hero-nav { width:calc(100% - 24px); } .nav-links { max-height:calc(100svh - 92px); overflow-y:auto; overscroll-behavior:contain; } .hero-copy { min-height:calc(100svh - 76px); padding-top:64px; padding-bottom:40px; } .hero-copy h1 { font-size:clamp(2.6rem,14vw,4rem); } .lede { margin-block:20px 24px; } main .work,main .about,main .trust,main .testimonials,main .capabilities,main .certificates,main .contact { padding-top:52px; padding-bottom:52px; } main .section-intro,main .about-heading,main .trust-heading,main .capabilities > h2,main .certificates > h2 { margin-bottom:32px; } main .project-meta { padding:20px; } main .project-meta h3 { font-size:clamp(1.9rem,11vw,3rem); } main .about-card,main .service-card { min-height:0; padding:22px 16px; } main .about-icon,main .service-card img { width:min(70vw,220px); margin-bottom:24px; } main .service-tags { align-items:center; justify-content:center; } main .service-tags span { text-align:center; } main .testimonial-card { padding-top:22px; padding-bottom:22px; } main .testimonial-card blockquote { max-height:11rem; padding-right:10px; } main .experience-tabs { display:grid; width:100%; grid-template-columns:repeat(2,minmax(0,1fr)); } main .experience-tab { width:100%; min-width:0; min-height:52px; white-space:normal; } .case-study { padding:40px 16px; } .page-nav { padding:12px 16px; gap:12px; } .page-nav a { min-height:44px; display:flex; align-items:center; } .case-hero h1 { font-size:clamp(2.4rem,13vw,4rem); } .case-impact { padding:20px 16px; } footer { padding-top:24px; padding-bottom:24px; } .footer-content { margin-top:20px; gap:18px; } .socials a { min-height:44px; display:inline-flex; align-items:center; } .project-editor,.admin-dashboard,.admin-login { padding-right:16px; padding-left:16px; } .editor-header h1 { font-size:clamp(2.2rem,12vw,3.5rem); } .editor-actions { margin-right:-16px; margin-left:-16px; padding-right:16px; padding-left:16px; } .admin-sidebar-links { grid-template-columns:1fr; } }
@media(prefers-reduced-motion:reduce) { *,*::before,*::after { scroll-behavior:auto !important; animation-duration:.1s !important; animation-iteration-count:1 !important; transition-duration:.1s !important; } .nav-links { transform:none !important; } .experience-panel.is-active { transform:none !important; } .button-light:active,.project-cta:active,.contact-button:active { transform:scale(.99); } }

/* Editor remains full-width for uninterrupted writing. */
.editor-workspace { display:block; }
.editor-panel { min-width:0; }
.editor-save-state { display:flex; align-items:center; gap:8px; color:#c5c2bb; }
.editor-save-dot { width:8px; height:8px; border-radius:50%; background:#8abd6a; }
.project-editor[data-save-state="saving"] .editor-save-dot { background:#e1b55d; }
.project-editor[data-save-state="error"] .editor-save-dot { background:#ffafa2; }
.editor-section-list { display:grid; gap:10px; }
.editor-section { border:1px solid rgba(244,241,234,.14); border-radius:10px; background:#191919; padding:0; }
.editor-section[open] { padding-bottom:24px; }
.editor-section-heading { display:grid; grid-template-columns:24px minmax(0,1fr) auto; gap:12px; align-items:center; padding:18px; cursor:pointer; list-style:none; }
.editor-section-heading::-webkit-details-marker { display:none; }
.editor-section-heading strong,.editor-section-heading .eyebrow { display:block; }
.editor-section-summary { color:#c5c2bb; font-size:.9rem; }
.editor-drag-handle { color:#92908a; cursor:grab; font-size:1.2rem; letter-spacing:-4px; user-select:none; }
.editor-section > form { margin:0; }
.editor-section-fields { display:grid; width:100%; min-width:0; gap:20px; margin:0; border:1px solid rgba(244,241,234,.14); border-radius:12px; background:#191919; padding:clamp(22px,4vw,36px); }
.editor-section-fields legend { padding:0 8px; color:#f4f1ea; font:700 clamp(1.4rem,2.4vw,2rem) 'Plus Jakarta Sans',sans-serif; }
.editor-section-actions { display:flex; align-items:center; gap:12px; margin:20px clamp(22px,4vw,36px) 0; }
.editor-section-actions .button { display:inline-flex; min-width:132px; min-height:44px; align-items:center; justify-content:center; margin:0; padding:13px 20px; font:inherit; font-weight:600; }
.editor-section-actions .editor-section-delete { display:block; margin:0; }
.editor-section-actions .button-delete { border-color:#b42318; background:#b42318; color:#fff; }
.editor-section-actions .button-delete:hover,.editor-section-actions .button-delete:focus-visible { border-color:#d92d20; background:#d92d20; }
.editor-section.is-dragging { opacity:.45; }
@media(max-width:700px) { .editor-section-heading { grid-template-columns:24px minmax(0,1fr); } .editor-section-summary { grid-column:2; } .editor-section-actions { align-items:stretch; flex-direction:column; } .editor-section-actions .button,.editor-section-actions .editor-section-delete { width:100%; } }
@media(max-width:480px) { main .project-meta { padding-right:var(--gutter); padding-left:var(--gutter); } }