:root {
  --ink: #102a2d;
  --ink-soft: #284548;
  --teal: #5d8b88;
  --sage: #a8c4c0;
  --mint: #dce8e5;
  --paper: #f5f7f5;
  --line: rgba(16, 42, 45, 0.2);
  --serif: "DM Sans", "PingFang TC", "Noto Sans TC", Arial, sans-serif;
  --sans: "DM Sans", Arial, sans-serif;
  --page-x: clamp(28px, 5vw, 76px);
  --section-y: clamp(104px, 11vw, 168px);
  --header-h: 73px;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin: 0; background: var(--paper); color: var(--ink); font-family: var(--sans); font-size: 16px; line-height: 1.65; overflow-x: hidden; }
a { color: inherit; text-decoration: none; }
img { display: block; width: 100%; }
.grain { position: fixed; inset: 0; pointer-events: none; opacity: .11; z-index: 10; background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.8' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.38'/%3E%3C/svg%3E"); mix-blend-mode: multiply; }
.cursor-glow { position: fixed; z-index: 0; width: 280px; height: 280px; border-radius: 50%; pointer-events: none; opacity: .2; background: radial-gradient(circle, rgba(168,196,192,.48), transparent 68%); transform: translate(-50%, -50%); transition: opacity .35s ease; }
.site-header, main, .site-footer { position: relative; z-index: 1; }
.site-header { position: absolute; inset: 0 0 auto; z-index: 5; display: flex; height: var(--header-h); align-items: center; justify-content: space-between; padding: 0 var(--page-x); border-bottom: 1px solid var(--line); font-size: 12px; letter-spacing: .04em; }
.brand { display: inline-flex; align-items: center; gap: 10px; font-weight: 600; letter-spacing: .08em; }
.brand-mark { display: block; width: 30px; height: 30px; flex: 0 0 30px; }
.nav-links { display: flex; position: absolute; left: 50%; gap: 34px; margin-left: 0; transform: translateX(-50%); }
.nav-links a, .header-contact { transition: color .25s ease; }
.nav-links a:hover, .header-contact:hover { color: var(--teal); }
.header-contact span, .text-link span { display: inline-block; transition: transform .25s ease; }
.header-contact:hover span, .text-link:hover span { transform: translate(3px, -3px); }
.section-grid { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); }
.hero.section-grid { display: block; }
.hero { min-height: 100svh; border-bottom: 1px solid var(--line); position: relative; overflow: hidden; }
.hero-copy { width: min(66%, 900px); min-height: 100svh; display: flex; flex-direction: column; justify-content: center; padding: calc(var(--header-h) + 7vh) clamp(36px, 6vw, 92px) max(104px, 12vh) var(--page-x); position: relative; z-index: 2; background: linear-gradient(90deg, rgba(245,247,245,.97) 0%, rgba(245,247,245,.9) 58%, rgba(245,247,245,0) 100%); }
.eyebrow { margin: 0 0 22px; color: var(--teal); font-size: 11px; letter-spacing: .16em; text-transform: uppercase; }
h1, h2, h3, p { margin-top: 0; }
h1, h2 { font-family: var(--serif); font-weight: 400; letter-spacing: 0; line-height: 1.18; }
h1 { max-width: 820px; margin-bottom: 34px; font-size: clamp(48px, 5.6vw, 86px); letter-spacing: 0; line-height: 1.18; }
h1 em, h2 em { color: var(--teal); font-style: italic; }
.hero-intro { max-width: 520px; margin-bottom: 38px; color: var(--ink-soft); font-size: 14px; line-height: 1.85; }
.text-link { display: inline-flex; align-items: center; gap: 16px; padding-bottom: 6px; border-bottom: 1px solid var(--ink); font-size: 12px; letter-spacing: .04em; }
.hero-art { position: absolute; inset: 0; z-index: 0; min-height: 100svh; overflow: hidden; background: radial-gradient(circle at 64% 48%, rgba(220,232,229,.7), transparent 25%), linear-gradient(130deg, #dce8e5 0%, #8fb9b5 52%, #5d8b88 100%); }
.hero-art::after { content: ""; position: absolute; inset: 0; opacity: .28; background-image: radial-gradient(rgba(245,247,245,.9) 1px, transparent 1px); background-size: 6px 6px; mask-image: linear-gradient(135deg, transparent 8%, black 48%, transparent 88%); }
.hero-orbit { position: absolute; border: 1px solid rgba(16,42,45,.46); border-radius: 50%; }
.orbit-one { width: min(42vw, 560px); aspect-ratio: 1; left: 9%; top: 21%; }
.orbit-two { width: min(28vw, 360px); aspect-ratio: 1; left: 27%; top: 35%; border-color: rgba(245,247,245,.55); }
.hero-node { position: absolute; width: 9px; height: 9px; border-radius: 50%; background: var(--paper); box-shadow: 0 0 0 6px rgba(245,247,245,.14); z-index: 2; }
.node-one { top: 26%; left: 46%; }.node-two { top: 64%; left: 25%; }
.hero-signal { position: absolute; right: 13%; bottom: 18%; display: flex; gap: 7px; align-items: end; height: 90px; z-index: 2; }
.hero-signal span { display: block; width: 2px; background: var(--ink); opacity: .72; }.hero-signal span:nth-child(1){height:35%}.hero-signal span:nth-child(2){height:88%}.hero-signal span:nth-child(3){height:58%}.hero-signal span:nth-child(4){height:72%}
.hero-footer { position: absolute; left: var(--page-x); right: var(--page-x); bottom: 28px; display: flex; justify-content: space-between; font-size: 10px; letter-spacing: .12em; text-transform: uppercase; }.scroll-note { color: var(--ink); }.scroll-note span { margin-left: 12px; font-size: 16px; }
.work-section { padding: var(--section-y) var(--page-x); }
.section-heading { display: flex; justify-content: space-between; align-items: end; margin-bottom: clamp(64px, 7vw, 104px); }.section-heading h2 { max-width: 720px; margin-bottom: 0; font-size: clamp(42px, 4.8vw, 72px); letter-spacing: 0; line-height: 1.2; }
.project { margin-bottom: var(--section-y); }.project:last-child { margin-bottom: 0; }
.project-media { display: block; position: relative; overflow: hidden; border: 1px solid var(--line); }.project-media img { aspect-ratio: 1.72 / 1; object-fit: cover; transition: transform .8s cubic-bezier(.2,.65,.2,1), filter .8s ease; }.project-media::after { content: ""; position: absolute; inset: 0; opacity: .1; background: linear-gradient(120deg, transparent 20%, rgba(220,232,229,.55) 50%, transparent 75%); transform: translateX(-100%); transition: transform .9s ease; }.project-media:hover img { transform: scale(1.035); filter: saturate(1.08); }.project-media:hover::after { transform: translateX(100%); }
.project-lilia .project-media { padding: clamp(30px, 5vw, 76px); background-color: #dce9e6; background-image: linear-gradient(rgba(66,87,80,.07) 1px, transparent 1px), linear-gradient(90deg, rgba(66,87,80,.07) 1px, transparent 1px), repeating-linear-gradient(165deg, transparent 0 52px, rgba(66,87,80,.045) 53px, transparent 54px); background-size: 28px 28px, 28px 28px, auto; }
.project-lilia .project-media img { position: relative; z-index: 1; aspect-ratio: 1024 / 500; object-fit: contain; box-shadow: 0 24px 48px rgba(35,65,65,.16); }
.project-lilia .project-media { isolation:isolate; background:#dce8e5 linear-gradient(135deg,#f1f7f5 0%,#dce8e5 42%,#a8c4c0 100%); }
.project-lilia .project-media::before { content:""; position:absolute; z-index:0; inset:-35% -20%; pointer-events:none; opacity:.66; background:radial-gradient(ellipse at 22% 52%,transparent 0 25%,rgba(255,255,255,.72) 27% 31%,transparent 34% 100%),radial-gradient(ellipse at 72% 46%,transparent 0 30%,rgba(93,139,136,.18) 32% 36%,transparent 39% 100%); filter:blur(18px); animation:lilia-wave-drift 14s ease-in-out infinite alternate; }
.project-lilia .project-media::after { content:""; position:absolute; z-index:0; inset:-28% -18%; pointer-events:none; opacity:.5; background:radial-gradient(ellipse at 64% 54%,transparent 0 24%,rgba(245,247,245,.8) 26% 30%,transparent 33% 100%),radial-gradient(ellipse at 34% 48%,transparent 0 34%,rgba(93,139,136,.16) 36% 40%,transparent 43% 100%); filter:blur(22px); transform:none; transition:none; animation:lilia-wave-drift-reverse 18s ease-in-out infinite alternate; }
.project-lilia .project-media img { z-index:1; background:transparent; box-shadow:none; mix-blend-mode:multiply; }
.project-lilia .media-index,.project-lilia .media-arrow { z-index:2; }
@keyframes lilia-wave-drift { from { transform:translate3d(-3%,1%,0) scale(1); } to { transform:translate3d(5%,-2%,0) scale(1.08); } }
@keyframes lilia-wave-drift-reverse { from { transform:translate3d(4%,-1%,0) scale(1.04); } to { transform:translate3d(-5%,3%,0) scale(.98); } }
@media(prefers-reduced-motion:reduce){.project-lilia .project-media::before,.project-lilia .project-media::after{animation:none}}

/* Match the existing Lilia Neuro case-cover background exactly. */
.project-lilia .project-media { background:radial-gradient(circle at 52% 46%,rgba(248,251,250,.98) 0 10%,rgba(220,232,229,.74) 34%,transparent 60%),linear-gradient(132deg,#eef4f2 0%,#d7e6e3 55%,#acc7c3 100%); }
.project-lilia .project-media::before,.project-lilia .project-media::after { display:none; animation:none; }

/* Lilia cover: straight gradient with clearly visible moving EEG traces. */
.project-lilia .project-media { background:#dce8e5 linear-gradient(180deg,#eef6f4 0%,#dce8e5 50%,#a8c4c0 100%); }
.project-lilia .project-media::before { inset:18% -100% auto; width:300%; height:30%; opacity:.38; filter:none; background-color:transparent; background-image:url("data:image/svg+xml,%3Csvg width='720' height='150' viewBox='0 0 720 150' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M0 76 L28 74 L42 78 L56 71 L70 76 L84 73 L98 77 L112 68 L126 82 L140 74 L154 76 L168 69 L182 79 L196 73 L210 76 L224 65 L238 85 L252 72 L266 77 L280 69 L294 80 L308 73 L322 76 L336 62 L350 88 L364 71 L378 78 L392 68 L406 81 L420 72 L434 77 L448 64 L462 86 L476 71 L490 78 L504 69 L518 80 L532 73 L546 77 L560 66 L574 84 L588 72 L602 77 L616 70 L630 79 L644 73 L658 77 L672 68 L686 82 L700 74 L720 76' fill='none' stroke='%235d8b88' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E"); background-repeat:repeat-x; background-size:720px 150px; animation:lilia-eeg-scroll 12s linear infinite; }
.project-lilia .project-media::after { inset:auto -100% 16%; width:300%; height:28%; opacity:.24; filter:none; background-color:transparent; background-image:url("data:image/svg+xml,%3Csvg width='640' height='140' viewBox='0 0 640 140' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M0 70 C16 70 18 54 32 70 S48 87 64 70 S82 50 96 70 S112 90 128 70 S145 57 160 70 S177 83 192 70 S210 46 224 70 S240 94 256 70 S273 55 288 70 S305 85 320 70 S338 49 352 70 S368 91 384 70 S401 56 416 70 S433 84 448 70 S466 52 480 70 S496 88 512 70 S529 55 544 70 S561 85 576 70 S594 51 608 70 S624 89 640 70' fill='none' stroke='%23284548' stroke-width='1.6'/%3E%3C/svg%3E"); background-repeat:repeat-x; background-size:640px 140px; transform:none; animation:lilia-eeg-scroll 18s linear infinite reverse; }
@keyframes lilia-eeg-scroll { from { background-position-x:0; } to { background-position-x:720px; } }
@media(prefers-reduced-motion:reduce){.project-lilia .project-media::before,.project-lilia .project-media::after{animation:none}}
.project-cordia .project-media { aspect-ratio:2/1; background:#fff; }
.project-cordia .project-media img { position:relative; z-index:1; width:100%; height:100%; aspect-ratio:2/1; object-fit:cover; }
.media-index, .media-arrow { position: absolute; z-index: 1; top: 22px; font-size: 11px; letter-spacing: .12em; }.media-index { left: 24px; }.media-arrow { right: 24px; font-size: 18px; transition: transform .25s ease; }.project-media:hover .media-arrow { transform: translate(3px, -3px); }.media-dark .media-index, .media-dark .media-arrow { color: var(--mint); }
.project-info { display: grid; grid-template-columns: .85fr 1.15fr; gap: 6vw; padding: 27px 0 0; border-top: 1px solid var(--line); }.project-number, .project-type { color: var(--teal); font-size: 11px; letter-spacing: .14em; text-transform: uppercase; }.project-info h3 { margin: 10px 0 0; font-family: var(--serif); font-size: clamp(46px, 5vw, 72px); font-weight: 400; line-height: 1; letter-spacing: 0; }.project-description { max-width: 520px; }.project-description p:not(.project-type) { color: var(--ink-soft); font-size: 14px; line-height: 1.85; margin: 0 0 25px; }.project-cordia .project-description p:not(.project-type) { color: #55716f; }
.approach-section { border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); }.approach-title { padding: var(--section-y) var(--page-x); border-right: 1px solid var(--line); }.approach-title h2, .about-copy h2 { margin: 0; font-size: clamp(42px, 5vw, 74px); letter-spacing: 0; line-height: 1.22; }.approach-copy { padding: var(--section-y) var(--page-x); }.large-copy { max-width: 620px; font-family: var(--serif); font-size: clamp(27px, 2.6vw, 38px); line-height: 1.32; letter-spacing: 0; }.principles { margin-top: clamp(64px, 7vw, 96px); }.principles > div { display: grid; grid-template-columns: 40px 1fr; gap: 12px; padding: 18px 0; border-top: 1px solid var(--line); }.principles span { color: var(--teal); font-size: 11px; }.principles strong { font-family: var(--serif); font-size: 23px; font-weight: 400; }.principles p { grid-column: 2; max-width: 360px; margin: -6px 0 0; color: var(--ink-soft); font-size: 13px; }
.about-section { display: grid; grid-template-columns: 1fr; min-height: 670px; border-bottom: 1px solid var(--line); }.about-copy { display: flex; flex-direction: column; justify-content: center; padding: var(--section-y) var(--page-x); }.about-copy > p:not(.eyebrow) { max-width: 680px; margin: 34px 0 40px; color: var(--ink-soft); font-size: 14px; line-height: 1.85; }.about-copy .text-link { align-self: start; }
.site-footer { display: grid; grid-template-columns: 1fr 1fr auto; gap: 24px; padding: 26px var(--page-x); font-size: 10px; letter-spacing: .12em; text-transform: uppercase; }.site-footer a { color: var(--teal); }
.about-page { background:var(--paper); }
.about-hero { min-height:100svh; display:grid; grid-template-columns:minmax(0,1.2fr) minmax(280px,.72fr); gap:clamp(48px,7vw,112px); align-items:center; padding:calc(var(--header-h) + 7vh) var(--page-x) 7vh; background:radial-gradient(circle at 78% 44%,rgba(168,196,192,.65),transparent 27%),linear-gradient(135deg,var(--paper) 45%,var(--mint)); border-bottom:1px solid var(--line); }
.about-hero-copy { position:relative; z-index:1; }
.about-hero h1 { max-width:900px; font-size:clamp(46px,4.4vw,68px); }
.about-hero-lead { max-width:680px; margin:10px 0 0; color:var(--ink-soft); font-size:16px; line-height:1.9; }
.about-portrait { position:relative; align-self:end; width:100%; max-width:500px; margin:0; border:1px solid var(--line); background:var(--ink); cursor:pointer; transform-origin:50% 90%; animation:about-swipe-card 5.6s cubic-bezier(.22,.7,.24,1) 1.4s infinite; touch-action:pan-y; }
.about-portrait:focus-visible { outline:3px solid var(--sage); outline-offset:6px; }
.about-portrait.is-swiping { animation:none; transition:none; }
.about-portrait.is-returning { animation:none; transition:transform .42s cubic-bezier(.22,1,.36,1); }
.about-portrait::before { content:""; position:absolute; z-index:1; inset:0; pointer-events:none; background:linear-gradient(145deg,rgba(168,196,192,.12),transparent 38%,rgba(16,42,45,.1)); mix-blend-mode:color; }
.about-portrait img { width:100%; aspect-ratio:3/4; object-fit:cover; object-position:50% 42%; }
.about-like-stamp { position:absolute; z-index:2; top:24px; left:22px; padding:5px 10px 4px; border:2px solid var(--mint); border-radius:3px; color:var(--mint); font-size:17px; font-weight:600; letter-spacing:.12em; line-height:1; opacity:0; transform:rotate(-9deg) scale(.82); animation:about-like-stamp 5.6s ease 1.4s infinite; }
.about-swipe-cue { position:absolute; z-index:3; right:18px; bottom:18px; display:inline-flex; align-items:center; gap:8px; padding:9px 12px; border:1px solid rgba(220,232,229,.42); border-radius:999px; background:rgba(16,42,45,.82); color:var(--paper); font-size:11px; letter-spacing:.06em; backdrop-filter:blur(8px); animation:about-swipe-cue 5.6s ease 1.4s infinite; }
.about-swipe-cue b { color:var(--sage); font-size:14px; font-weight:400; animation:about-swipe-arrow 1.15s ease-in-out infinite; }
@keyframes about-swipe-card { 0%,22%,58%,100%{transform:translate3d(0,0,0) rotate(0)} 34%{transform:translate3d(22px,0,0) rotate(1.7deg)} 42%{transform:translate3d(17px,0,0) rotate(1.2deg)} 49%{transform:translate3d(7px,0,0) rotate(.45deg)} 54%{transform:translate3d(2px,0,0) rotate(.12deg)} }
@keyframes about-like-stamp { 0%,25%,54%,100%{opacity:0;transform:rotate(-9deg) scale(.82)} 34%,45%{opacity:1;transform:rotate(-9deg) scale(1)} }
@keyframes about-swipe-cue { 0%,20%,58%,100%{opacity:1;transform:translateX(0)} 34%,46%{opacity:.68;transform:translateX(8px)} }
@keyframes about-swipe-arrow { 0%,100%{transform:translateX(0)} 50%{transform:translateX(4px)} }
.about-story,.about-interests { display:grid; grid-template-columns:.9fr 1.1fr; gap:9vw; padding:var(--section-y) var(--page-x); border-bottom:1px solid var(--line); }
.about-story h2,.about-interests h2,.about-contact h2 { font-size:clamp(42px,5vw,74px); }
.about-story-copy,.about-interest-copy { align-self:end; max-width:650px; color:var(--ink-soft); line-height:1.9; }
.about-facts { padding:var(--section-y) var(--page-x); background:var(--ink); color:var(--paper); }
.about-fact-grid { display:grid; grid-template-columns:repeat(3,1fr); margin-top:70px; border-top:1px solid rgba(220,232,229,.25); }
.about-fact-grid article { min-height:280px; padding:30px 30px 0 0; }
.about-fact-grid article+article { padding-left:30px; border-left:1px solid rgba(220,232,229,.25); }
.about-fact-grid span { color:var(--sage); font-size:11px; }
.about-fact-grid h3 { margin:52px 0 18px; font-size:27px; font-weight:500; }
.about-fact-grid p { color:var(--sage); font-size:13px; }
.about-placeholder { padding:20px 0; border-top:1px solid var(--line); border-bottom:1px solid var(--line); color:var(--teal); }
.about-contact { padding:var(--section-y) var(--page-x); }
.about-contact p:not(.eyebrow) { max-width:620px; color:var(--ink-soft); }
.about-contact .text-link { margin-top:30px; }
.about-interest-list { display:flex; flex-wrap:wrap; gap:10px; margin-top:34px; }
.about-interest-list span { padding:7px 12px; border:1px solid var(--line); border-radius:999px; color:var(--teal); font-size:11px; letter-spacing:.06em; }
.about-contact-links { display:flex; flex-wrap:wrap; gap:18px 34px; }
.about-coming-soon { margin-top:38px; padding-top:18px; border-top:1px solid var(--line); font-size:12px; }
@media(max-width:800px){.about-hero{grid-template-columns:1fr;gap:56px;min-height:auto;padding-top:calc(var(--header-h) + 72px);padding-bottom:0}.about-hero h1{font-size:clamp(42px,12vw,60px)}.about-portrait{justify-self:center;width:calc(100% + (2 * var(--page-x)));max-width:none;border-right:0;border-bottom:0;border-left:0}.about-portrait img{aspect-ratio:4/5;object-position:50% 38%}.about-like-stamp{top:20px;left:var(--page-x)}.about-swipe-cue{right:var(--page-x);bottom:20px}.about-story,.about-interests,.about-fact-grid{grid-template-columns:1fr}.about-story,.about-interests{gap:48px}.about-fact-grid article,.about-fact-grid article+article{min-height:0;padding:30px 0 50px;border-left:0;border-bottom:1px solid rgba(220,232,229,.25)}}
.reveal { opacity: 0; transform: translateY(28px); transition: opacity .9s ease, transform .9s cubic-bezier(.2,.65,.2,1); }.reveal.is-visible { opacity: 1; transform: translateY(0); }
@media (max-width: 800px) { :root { --page-x: 24px; --section-y: 96px; --header-h: 65px; }.site-header { height: var(--header-h); padding: 0 var(--page-x); }.nav-links { gap: 18px; margin-left: 0; }.header-contact { display: none; }.section-grid, .hero.section-grid, .about-section { grid-template-columns: 1fr; }.hero { min-height: auto; }.hero-copy { min-height: 100svh; padding: calc(var(--header-h) + 64px) var(--page-x) 112px; }.hero-art { min-height: 52svh; border-left: 0; border-top: 1px solid var(--line); }.orbit-one { width: 78vw; left: 7%; top: 13%; }.orbit-two { width: 54vw; left: 24%; top: 27%; }.hero-footer { position: absolute; left: var(--page-x); right: var(--page-x); bottom: calc(52svh + 24px); }.scroll-note { display: none; }.work-section { padding: var(--section-y) var(--page-x); }.section-heading { display: block; margin-bottom: 64px; }.section-heading .eyebrow { margin-bottom: 30px; }.project { margin-bottom: var(--section-y); }.project-info { grid-template-columns: 1fr; gap: 28px; }.project-description { max-width: none; }.approach-title, .approach-copy { padding: var(--section-y) var(--page-x); }.approach-title { border-right: 0; border-bottom: 1px solid var(--line); }.principles { margin-top: 60px; }.about-image { min-height: 360px; }.about-copy { padding: var(--section-y) var(--page-x); }.site-footer { grid-template-columns: 1fr; gap: 10px; padding: 24px var(--page-x); }.site-footer a { margin-top: 10px; } }
@media (max-width: 800px) { .hero { min-height: 100svh; }.hero-copy { width: 100%; background: linear-gradient(90deg, rgba(245,247,245,.94) 0%, rgba(245,247,245,.82) 70%, rgba(245,247,245,.34) 100%); }.hero-art { position: absolute; inset: 0; min-height: 100svh; border: 0; }.hero-footer { bottom: 24px; z-index: 3; } }
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; }.reveal, .project-media img, .project-media::after, .about-image img, .header-contact span, .text-link span { transition: none; }.cursor-glow { display: none; } }
@media (prefers-reduced-motion: reduce) { .about-portrait,.about-like-stamp,.about-swipe-cue,.about-swipe-cue b { animation:none; }.about-like-stamp { display:none; } }

/* Case study */
.case-page { background: var(--paper); }
.case-header { position: absolute; }
.case-hero { min-height: 100svh; display: grid; grid-template-columns: 1.35fr .65fr; padding: calc(var(--header-h) + 10vh) var(--page-x) 10vh; background: radial-gradient(circle at 82% 34%, rgba(168,196,192,.72), transparent 28%), linear-gradient(135deg, var(--paper) 42%, var(--mint) 100%); border-bottom: 1px solid var(--line); }
.case-hero-copy { align-self: center; max-width: 900px; }
.case-hero h1 { max-width: 900px; }
.case-lead { max-width: 650px; margin: 42px 0 0; color: var(--ink-soft); font-size: 16px; line-height: 1.9; }
.case-meta { align-self: end; padding-left: clamp(32px, 5vw, 76px); border-left: 1px solid var(--line); }
.case-meta div { padding: 20px 0; border-top: 1px solid var(--line); }
.case-meta span { display: block; margin-bottom: 8px; color: var(--teal); font-size: 11px; letter-spacing: .12em; }
.case-meta strong { font-size: 13px; font-weight: 500; }
.case-cover { margin: 0; padding: var(--page-x); background: var(--ink); }
.case-cover img { width: 100%; max-height: 88svh; object-fit: cover; }
.case-cover-product { position: relative; min-height: 70vh; overflow: hidden; padding: 0; background: radial-gradient(circle at 52% 46%, rgba(248,251,250,.98) 0 10%, rgba(220,232,229,.74) 34%, transparent 60%), linear-gradient(132deg, #eef4f2 0%, #d7e6e3 55%, #acc7c3 100%); }
.case-cover-product::before { content: ""; position: absolute; inset: 0; opacity: .26; background-image: radial-gradient(rgba(16,42,45,.24) .65px, transparent .65px); background-size: 6px 6px; mask-image: linear-gradient(118deg, black, transparent 76%); }
.case-cover-product::after { content: ""; position: absolute; inset: 0; pointer-events: none; background: linear-gradient(90deg, rgba(238,244,242,.3), transparent 24% 76%, rgba(99,143,139,.08)); }
.cover-identity { position: absolute; z-index: 4; top: clamp(30px, 4vw, 64px); left: var(--page-x); display: flex; flex-direction: column; gap: 8px; }
.cover-identity strong { font-family: var(--serif); font-size: clamp(30px, 3vw, 48px); font-weight: 400; line-height: 1; }
.cover-identity span, .cover-sequence { color: var(--ink-soft); font-size: 10px; letter-spacing: .14em; }
.neuro-field { position: absolute; z-index: 1; inset: 0; overflow: hidden; pointer-events: none; }
.neuro-lines { position: absolute; inset: 6% -4% 4%; width: 108%; height: 90%; opacity: .44; }
.neuro-lines path { fill: none; stroke: rgba(45,102,100,.3); stroke-width: 1.15; stroke-linecap: round; stroke-dasharray: 3 13; animation: neuro-signal 14s linear infinite; }
.neuro-lines path:nth-child(2) { opacity: .66; animation-duration: 18s; animation-direction: reverse; }
.neuro-lines path:nth-child(3) { opacity: .42; animation-duration: 22s; }
.neuro-node { position: absolute; width: 7px; aspect-ratio: 1; border-radius: 50%; background: rgba(37,102,99,.72); box-shadow: 0 0 0 7px rgba(76,142,137,.08), 0 0 26px rgba(33,105,101,.34); animation: neuro-pulse 3.4s ease-in-out infinite; }
.neuro-node::after { content: ""; position: absolute; inset: -18px; border: 1px solid rgba(69,132,128,.2); border-radius: 50%; animation: neuro-ring 3.4s ease-out infinite; }
.neuro-node-a { left: 15%; top: 48%; }.neuro-node-b { left: 31%; top: 32%; animation-delay: -.8s; }.neuro-node-c { right: 32%; top: 67%; animation-delay: -1.6s; }.neuro-node-d { right: 16%; top: 28%; animation-delay: -2.4s; }.neuro-node-e { left: 53%; top: 76%; animation-delay: -1.1s; }
.cover-widget-stage { position: absolute; z-index: 3; left: 50%; top: 55%; width: min(88vw, 1120px); aspect-ratio: 1024 / 500; transform: translate(-50%, -50%); }
.cover-widget-animation { display: block; width: 100%; height: 100%; object-fit: contain; filter: drop-shadow(0 22px 28px rgba(16,42,45,.16)); }
.cover-widget { --delay: 0s; position: absolute; opacity: 0; transform-origin: 50% 80%; animation: cover-widget-in .9s var(--delay) both cubic-bezier(.16,.74,.18,1); }
.cover-widget::before { content: ""; position: absolute; z-index: -1; inset: 12% 8% -4%; border-radius: 24px; background: rgba(20,63,65,.28); filter: blur(22px); opacity: 0; transform: translateY(24px) scale(.82); animation: cover-widget-shadow .9s var(--delay) both cubic-bezier(.16,.74,.18,1); }
.cover-widget img { display: block; width: 100%; max-height: none; filter: drop-shadow(0 18px 20px rgba(16,42,45,.13)) drop-shadow(0 5px 8px rgba(16,42,45,.1)); }
.cover-widget-spectrum { --delay: .08s; z-index: 1; left: 12%; top: 21%; width: 18.8%; }
.cover-widget-emotion { --delay: .24s; z-index: 3; left: 38%; top: 5%; width: 26.5%; }
.cover-widget-course { --delay: .4s; z-index: 2; left: 69%; top: 22%; width: 15.2%; }
.cover-widget-training { --delay: .56s; z-index: 2; left: 61%; top: 39%; width: 14.1%; }
.cover-widget-ai { --delay: .72s; z-index: 5; left: 27%; top: 65%; width: 28.6%; }
.cover-sequence { position: absolute; z-index: 4; left: var(--page-x); right: var(--page-x); bottom: 28px; display: flex; justify-content: space-between; margin: 0; }
@keyframes cover-widget-in { 0% { opacity: 0; transform: translateY(34px) scale(.86); filter: blur(6px); } 65% { opacity: 1; } 100% { opacity: 1; transform: translateY(0) scale(1); filter: blur(0); } }
@keyframes cover-widget-shadow { from { opacity: 0; transform: translateY(28px) scale(.76); } to { opacity: .58; transform: translateY(14px) scale(1); } }
@keyframes neuro-signal { to { stroke-dashoffset: -192; } }
@keyframes neuro-pulse { 0%, 100% { opacity: .38; transform: scale(.72); } 45% { opacity: .9; transform: scale(1); } }
@keyframes neuro-ring { 0% { opacity: 0; transform: scale(.3); } 36% { opacity: .65; } 100% { opacity: 0; transform: scale(1.35); } }
.case-section { padding: var(--section-y) var(--page-x); border-bottom: 1px solid var(--line); }
.case-split { display: grid; grid-template-columns: .9fr 1.1fr; gap: 10vw; }
.case-section h2 { max-width: 720px; font-size: clamp(42px, 5vw, 76px); line-height: 1.22; }
.case-body { max-width: 680px; }
.case-body p { margin-bottom: 26px; color: var(--ink-soft); font-size: 16px; line-height: 1.9; }
.case-dark { background: var(--ink); color: var(--paper); }
.case-dark .eyebrow { color: var(--sage); }
.case-dark h2 { max-width: 900px; }
.challenge-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 0; margin-top: clamp(72px, 9vw, 130px); border-top: 1px solid rgba(220,232,229,.28); }
.challenge-grid article { min-height: 280px; padding: 28px 34px 0 0; border-right: 1px solid rgba(220,232,229,.28); }
.challenge-grid article + article { padding-left: 34px; }
.challenge-grid article:last-child { border-right: 0; }
.challenge-grid span, .experience-rail span { color: var(--sage); font-size: 11px; letter-spacing: .12em; }
.challenge-grid h3, .experience-rail h3 { margin: 34px 0 16px; font-family: var(--serif); font-size: 30px; font-weight: 400; }
.challenge-grid p { max-width: 330px; color: rgba(245,247,245,.72); font-size: 14px; line-height: 1.8; }
.case-section-heading { display: flex; align-items: end; justify-content: space-between; gap: 40px; }
.case-section-heading h2 { margin-bottom: 0; }
.experience-rail { display: grid; grid-template-columns: repeat(3, 1fr); margin-top: clamp(72px, 9vw, 130px); border-top: 1px solid var(--line); }
.experience-rail article { padding: 28px 34px 0 0; }
.experience-rail article + article { padding-left: 34px; border-left: 1px solid var(--line); }
.experience-rail span { color: var(--teal); }
.experience-rail p { max-width: 350px; color: var(--ink-soft); font-size: 14px; line-height: 1.8; }
.case-quote { display: grid; place-items: center; min-height: 72svh; background: linear-gradient(135deg, var(--mint), var(--sage)); }
.case-quote p { max-width: 900px; margin: 0; text-align: center; font-family: var(--serif); font-size: clamp(38px, 5vw, 72px); line-height: 1.28; }
.case-next { display: flex; justify-content: space-between; align-items: end; gap: 48px; padding: 72px var(--page-x); }
.case-next p { max-width: 420px; margin: 0; font-family: var(--serif); font-size: 28px; }
.case-next > div { display: flex; gap: 32px; }
.research-intro { max-width: 680px; margin: 48px 0 0 auto; color: var(--ink-soft); font-size: 15px; line-height: 1.85; }
.insight-grid { display: grid; grid-template-columns: repeat(2, 1fr); margin-top: clamp(72px, 8vw, 116px); border-top: 1px solid var(--line); }
.insight-card { min-height: 360px; padding: 30px 52px 44px 0; border-bottom: 1px solid var(--line); opacity: 0; transform: translateY(26px); transition: opacity .75s ease, transform .75s cubic-bezier(.2,.65,.2,1); }
.insight-card:nth-child(even) { padding-left: 52px; border-left: 1px solid var(--line); }
.research-section.is-visible .insight-card { opacity: 1; transform: translateY(0); }
.research-section.is-visible .insight-card:nth-child(2) { transition-delay: .1s; }
.research-section.is-visible .insight-card:nth-child(3) { transition-delay: .2s; }
.research-section.is-visible .insight-card:nth-child(4) { transition-delay: .3s; }
.insight-card span, .decision-grid span { color: var(--teal); font-size: 11px; letter-spacing: .12em; }
.insight-card h3 { max-width: 470px; margin: 34px 0 18px; font-family: var(--serif); font-size: clamp(28px, 2.8vw, 42px); font-weight: 400; line-height: 1.3; }
.insight-card p { max-width: 480px; margin: 0 0 30px; color: var(--ink-soft); font-size: 14px; line-height: 1.8; }
.insight-card strong { display: block; margin-bottom: 8px; color: var(--teal); font-size: 11px; font-weight: 500; letter-spacing: .1em; }
.core-insight { max-width: 980px; margin: clamp(84px, 10vw, 150px) auto 0; padding: 0; border: 0; text-align: center; opacity: 0; transform: translateY(20px); transition: opacity .8s .38s ease, transform .8s .38s cubic-bezier(.2,.65,.2,1); }
.research-section.is-visible .core-insight { opacity: 1; transform: translateY(0); }
.core-insight span { color: var(--teal); font-size: 11px; letter-spacing: .14em; }
.core-insight p { margin: 28px 0 0; font-family: var(--serif); font-size: clamp(34px, 4.5vw, 64px); line-height: 1.3; }
.design-showcase { display: grid; grid-template-columns: .82fr 1.18fr; min-height: 100svh; overflow: hidden; border-bottom: 1px solid var(--line); background: var(--mint); }
.showcase-copy { display: flex; flex-direction: column; justify-content: center; padding: var(--section-y) var(--page-x); border-right: 1px solid var(--line); }
.showcase-copy h2 { max-width: 620px; margin: 0; font-family: var(--serif); font-size: clamp(42px, 5vw, 74px); font-weight: 400; line-height: 1.22; }
.showcase-lead { max-width: 520px; margin: 38px 0 0; color: var(--ink-soft); font-size: 15px; line-height: 1.85; }
.showcase-points { margin: clamp(56px, 7vw, 90px) 0 0; padding: 0; list-style: none; border-top: 1px solid var(--line); }
.showcase-points li { display: grid; grid-template-columns: 42px 1fr; gap: 16px; padding: 18px 0; border-bottom: 1px solid var(--line); }
.showcase-points span { color: var(--teal); font-size: 11px; }
.showcase-points strong { font-family: var(--serif); font-size: 22px; font-weight: 400; }
.showcase-points p { margin: 4px 0 0; color: var(--ink-soft); font-size: 13px; line-height: 1.7; }
.result-nav li { display: block; padding: 0; }
.result-nav-button { display: grid; width: 100%; grid-template-columns: 42px 1fr; gap: 16px; padding: 18px 0; border: 0; background: transparent; color: var(--ink); font: inherit; text-align: left; cursor: pointer; transition: color .25s ease, opacity .25s ease; }
.result-nav-button span { padding-top: 4px; }
.result-nav-button strong { transition: color .25s ease; }
.result-nav-button:not(.is-active) { opacity: .58; }
.result-nav-button:hover, .result-nav-button:focus-visible, .result-nav-button.is-active { opacity: 1; }
.result-nav-button.is-active strong { color: var(--teal); }
.result-nav-button:focus-visible { outline: 2px solid var(--teal); outline-offset: 4px; }
.phone-stage { position: relative; display: grid; place-items: center; min-height: 100svh; margin: 0; padding: 9vh var(--page-x); background: radial-gradient(circle at 50% 45%, rgba(245,247,245,.95), rgba(168,196,192,.35) 36%, transparent 68%); }
.phone-screen { position: relative; z-index: 1; width: min(390px, 72%); max-height: 82svh; overflow: hidden; border-radius: 28px; box-shadow: none; transition: transform .8s cubic-bezier(.2,.65,.2,1); }
.phone-screen img { width: 100%; max-height: 82svh; object-fit: contain; border-radius: 0; }
.home-showcase.is-visible .phone-screen { animation: phone-arrive 1s .15s both cubic-bezier(.2,.65,.2,1); }
.result-showcase { background: #eef3f1; }
.result-stage { background: radial-gradient(circle at 50% 45%, rgba(255,255,255,.94), rgba(190,211,207,.42) 38%, transparent 70%); }
.result-screen { width: min(520px, 82%); border-radius: 0; }
.result-screen object { display: block; width: 100%; max-height: 82svh; aspect-ratio: 693 / 1428; }
.result-showcase.is-visible .result-screen { animation: phone-arrive 1s .15s both cubic-bezier(.2,.65,.2,1); }
.replay-button { position: absolute; z-index: 2; right: clamp(18px, 3vw, 48px); bottom: clamp(18px, 4vh, 44px); display: inline-flex; align-items: center; gap: 8px; padding: 11px 15px; border: 1px solid rgba(16,42,45,.22); border-radius: 6px; background: rgba(248,250,249,.88); color: var(--ink); font: inherit; font-size: 12px; cursor: pointer; backdrop-filter: blur(10px); transition: background .2s ease, border-color .2s ease, transform .2s ease; }
.replay-button span { font-size: 18px; line-height: 1; }
.replay-button:hover { border-color: rgba(16,42,45,.46); background: #fff; transform: translateY(-2px); }
.replay-button:focus-visible { outline: 2px solid var(--teal); outline-offset: 3px; }
.phone-halo { position: absolute; width: min(42vw, 560px); aspect-ratio: 1; border: 1px solid rgba(16,42,45,.18); border-radius: 50%; }
@keyframes phone-arrive { from { opacity: 0; transform: translateY(44px) scale(.97); } to { opacity: 1; transform: translateY(0) scale(1); } }
.decision-section { background: var(--mint); }
.decision-grid { display: grid; grid-template-columns: repeat(2, 1fr); margin-top: clamp(72px, 9vw, 126px); border-top: 1px solid var(--line); }
.decision-grid article { padding: 34px 54px 0 0; }
.decision-grid article + article { padding-left: 54px; border-left: 1px solid var(--line); }
.decision-grid h2 { margin: 34px 0; font-size: clamp(34px, 3.8vw, 58px); line-height: 1.24; }
.decision-grid p { max-width: 540px; color: var(--ink-soft); font-size: 15px; line-height: 1.9; }
.outcome-section { display: grid; grid-template-columns: .9fr 1.1fr; gap: 10vw; }
.outcome-list { border-top: 1px solid var(--line); }
.outcome-list div { display: grid; grid-template-columns: 120px 1fr; gap: 30px; padding: 24px 0; border-bottom: 1px solid var(--line); }
.outcome-list strong { font-family: var(--serif); font-size: 22px; font-weight: 400; }
.outcome-list p { margin: 0; color: var(--ink-soft); font-size: 14px; line-height: 1.8; }
@media (max-width: 800px) { .case-hero { grid-template-columns: 1fr; min-height: auto; padding: calc(var(--header-h) + 80px) var(--page-x) 90px; }.case-meta { margin-top: 72px; padding-left: 0; border-left: 0; }.case-lead { font-size: 15px; }.case-cover:not(.case-cover-product) { padding: 12px; }.case-cover-product { min-height: 680px; }.cover-identity { top: 32px; }.cover-widget-stage { top: 55%; width: 126vw; }.case-split, .challenge-grid, .experience-rail, .insight-grid, .decision-grid, .outcome-section, .design-showcase { grid-template-columns: 1fr; }.case-split, .outcome-section { gap: 48px; }.insight-card, .insight-card:nth-child(even), .decision-grid article, .decision-grid article + article { min-height: 0; padding: 28px 0 48px; border-left: 0; border-bottom: 1px solid var(--line); }.challenge-grid article, .challenge-grid article + article, .experience-rail article, .experience-rail article + article { min-height: 0; padding: 28px 0 52px; border-right: 0; border-left: 0; border-bottom: 1px solid rgba(220,232,229,.28); }.experience-rail article, .experience-rail article + article { border-bottom-color: var(--line); }.case-section-heading, .case-next { display: block; }.case-section-heading h2 { margin-top: 36px; }.research-intro { margin-top: 36px; }.showcase-copy { border-right: 0; border-bottom: 1px solid var(--line); }.phone-stage { min-height: 86svh; }.phone-screen { width: min(330px, 82%); max-height: 72svh; border-radius: 24px; }.phone-screen img { max-height: 72svh; }.phone-halo { width: 78vw; }.replay-button { right: 16px; bottom: 16px; }.outcome-list div { grid-template-columns: 1fr; gap: 8px; }.case-next p { margin-bottom: 42px; }.case-next > div { align-items: start; flex-direction: column; gap: 24px; } }
@media (prefers-reduced-motion: reduce) { .insight-card, .core-insight { opacity: 1; transform: none; transition: none; }.cover-widget, .cover-widget::before, .neuro-lines path, .neuro-node, .neuro-node::after { opacity: 1; animation: none; }.home-showcase.is-visible .phone-screen, .result-showcase.is-visible .result-screen { animation: none; } }

/* Cordia case */
.cordia-page { --cordia-blue:#2868f0; --cordia-dark:#07121f; --cordia-line:#d7dce3; background:#fff; color:#111820; }
.cordia-page .eyebrow, .cordia-page section > span, .cordia-heading > span, .cordia-intro article > span, .cordia-showcase-copy > span { color:#64707d; font-size:11px; letter-spacing:.13em; text-transform:uppercase; }
.cordia-hero { display:grid; grid-template-columns:.75fr 1.25fr; gap:5vw; min-height:100svh; padding:calc(var(--header-h) + 70px) var(--page-x) 52px; border-bottom:1px solid var(--cordia-line); }
.cordia-hero-copy { align-self:center; }
.cordia-hero h1 { margin:0; font-family:var(--serif); font-size:clamp(48px,5.7vw,88px); font-weight:400; line-height:1.12; letter-spacing:-.045em; }
.cordia-hero h1 em { color:var(--cordia-blue); font-weight:400; }
.cordia-hero-copy > p { max-width:560px; margin:40px 0 0; color:#66717d; line-height:1.85; }
.cordia-hero-media { align-self:center; margin:0; overflow:hidden; border:1px solid #cfd5dc; border-radius:12px; background:#f6f7f8; box-shadow:0 24px 70px rgba(20,34,50,.13); }
.browser-bar { display:flex; align-items:center; gap:6px; height:38px; padding:0 12px; border-bottom:1px solid #d9dde2; background:#f4f5f6; color:#7d8792; font-size:10px; }
.browser-bar i { width:7px; height:7px; border-radius:50%; background:#c7ccd2; }.browser-bar i:first-child{background:#ff6b62}.browser-bar i:nth-child(2){background:#f4bf4f}.browser-bar i:nth-child(3){background:#5cc970}.browser-bar span{margin-left:12px}
.cordia-hero-media img { display:block; width:100%; aspect-ratio:1.45/1; object-fit:cover; object-position:center; }
.cordia-meta { grid-column:1/-1; display:grid; grid-template-columns:repeat(3,1fr); margin-top:28px; border-top:1px solid var(--cordia-line); }
.cordia-meta div { padding:18px 20px 0 0; }.cordia-meta div+div{padding-left:28px;border-left:1px solid var(--cordia-line)}.cordia-meta span{display:block;color:#7a8490;font-size:10px;letter-spacing:.1em;text-transform:uppercase}.cordia-meta strong{display:block;margin-top:8px;font-size:13px;font-weight:500}
.cordia-intro { display:grid; grid-template-columns:1fr 1fr; padding:0 var(--page-x); border-bottom:1px solid var(--cordia-line); }
.cordia-intro article { padding:100px 7vw 110px 0; }.cordia-intro article+article{padding-left:7vw;border-left:1px solid var(--cordia-line)}.cordia-intro h2{margin:30px 0;font-family:var(--serif);font-size:clamp(32px,3.5vw,54px);font-weight:400;line-height:1.28}.cordia-intro p{max-width:560px;color:#66717d;font-size:14px;line-height:1.9}
.cordia-research,.cordia-findings,.cordia-principles,.cordia-flow,.cordia-validation,.cordia-reflection { padding:var(--section-y) var(--page-x); border-bottom:1px solid var(--cordia-line); }
.cordia-heading { display:flex; justify-content:space-between; align-items:flex-start; gap:6vw; }.cordia-heading h2{max-width:850px;margin:0;font-family:var(--serif);font-size:clamp(42px,5vw,76px);font-weight:400;line-height:1.18}
.participant-grid { display:grid; grid-template-columns:2fr .65fr .65fr; margin-top:100px; border-top:1px solid var(--cordia-line);border-bottom:1px solid var(--cordia-line)}
.participant-grid>div{min-height:240px;padding:32px}.participant-grid>div+div{border-left:1px solid var(--cordia-line)}.participant-main p{max-width:620px;color:#66717d;line-height:1.85}.participant-types{display:flex;gap:38px;margin-top:48px}.participant-types span{font-size:12px}.participant-types b{display:block;margin-bottom:8px;color:var(--cordia-blue);font-family:var(--serif);font-size:38px;font-weight:400}.research-number{display:flex;flex-direction:column;justify-content:center}.research-number b{font-family:var(--serif);font-size:88px;font-weight:400}.research-number span{color:#64707d;font-size:12px}
.finding-list{display:grid;grid-template-columns:repeat(4,1fr);margin-top:100px;border-top:1px solid var(--cordia-line);border-bottom:1px solid var(--cordia-line)}.finding-list article{min-height:290px;padding:28px 28px 40px 0}.finding-list article+article{padding-left:28px;border-left:1px solid var(--cordia-line)}.finding-list article>span{color:var(--cordia-blue);font-size:11px}.finding-list h3{margin:40px 0 18px;font-family:var(--serif);font-size:28px;font-weight:400}.finding-list p{color:#66717d;font-size:13px;line-height:1.75}.cordia-findings blockquote{max-width:1050px;margin:120px auto 0;padding:0;border:0;text-align:center;font-family:var(--serif);font-size:clamp(34px,4.4vw,64px);line-height:1.3}
.cordia-principles{display:grid;grid-template-columns:1fr 1fr;gap:10vw}.cordia-principles h2{margin:30px 0;font-family:var(--serif);font-size:clamp(38px,4.4vw,66px);font-weight:400;line-height:1.2}.cordia-principles p{max-width:620px;color:#66717d;line-height:1.85}.cordia-principles ol{margin:0;padding:0;list-style:none;border-top:1px solid var(--cordia-line)}.cordia-principles li{display:grid;grid-template-columns:42px 1fr;gap:6px 18px;padding:26px 0;border-bottom:1px solid var(--cordia-line)}.cordia-principles li b{grid-row:1/3;color:var(--cordia-blue);font-size:11px}.cordia-principles li strong{font-family:var(--serif);font-size:24px;font-weight:400}.cordia-principles li span{color:#66717d;font-size:13px}
.cordia-flow ol{display:grid;grid-template-columns:repeat(5,1fr);margin:90px 0 0;padding:0;list-style:none;border-top:1px solid var(--cordia-line)}.cordia-flow li{position:relative;padding:30px 22px 0 0}.cordia-flow li+li{padding-left:24px;border-left:1px solid var(--cordia-line)}.cordia-flow li:not(:last-child)::after{content:'→';position:absolute;right:18px;top:30px;color:var(--cordia-blue)}.cordia-flow b{display:block;color:#82909c;font-size:10px}.cordia-flow li>span{display:block;margin-top:55px;font-family:var(--serif);font-size:28px}.cordia-flow p{color:#66717d;font-size:12px}
.cordia-showcase{display:grid;grid-template-columns:.7fr 1.3fr;min-height:90svh;border-bottom:1px solid var(--cordia-line);background:#f7f8fa}.cordia-showcase-dark{background:var(--cordia-dark);color:#f5f7fa}.cordia-showcase-copy{display:flex;flex-direction:column;justify-content:center;padding:var(--section-y) var(--page-x);border-right:1px solid rgba(130,145,160,.28)}.cordia-showcase-copy h2{margin:24px 0 30px;font-family:var(--serif);font-size:clamp(46px,5vw,74px);font-weight:400}.cordia-showcase-copy p{max-width:500px;color:#6f7a86;font-size:14px;line-height:1.85}.cordia-showcase-dark .cordia-showcase-copy p{color:#aab5c1}.cordia-showcase-copy ul{margin:55px 0 0;padding:0;list-style:none;border-top:1px solid rgba(130,145,160,.28)}.cordia-showcase-copy li{padding:15px 0;border-bottom:1px solid rgba(130,145,160,.28);font-size:12px}
.cordia-ui,.timeline-ui,.signal-ui{align-self:center;margin:6vw;min-height:520px;border:1px solid rgba(148,163,184,.3);border-radius:10px;box-shadow:0 24px 80px rgba(0,0,0,.18)}
.device-ui{display:grid;grid-template-columns:150px 1fr;overflow:hidden;background:#0d1a29}.device-ui aside{display:flex;flex-direction:column;gap:8px;padding:24px 14px;border-right:1px solid #2c3a49}.device-ui aside strong{margin:0 8px 28px;font-size:18px}.device-ui aside span{padding:10px;border-radius:5px;color:#8998a8;font-size:11px}.device-ui aside .active{background:var(--cordia-blue);color:white}.device-table{padding:24px}.device-table header{display:flex;justify-content:space-between;align-items:center;margin-bottom:38px}.device-table button,.timeline-ui button{border:0;border-radius:4px;background:var(--cordia-blue);color:#fff;padding:9px 12px}.device-table>div{display:grid;grid-template-columns:1.3fr .7fr .5fr;padding:22px 0;border-top:1px solid #2b3948;font-size:12px}.device-table em{color:#65d693;font-style:normal}.device-table small{color:#8d9bac}
.timeline-ui{position:relative;align-self:center;overflow:hidden;background:#fff;padding:28px}.timeline-ui header{display:flex;align-items:center;gap:20px;height:40px}.timeline-ui header i{height:2px;flex:1;background:#dfe4eb}.time-axis{display:flex;justify-content:space-between;margin:28px 0 15px;padding-left:105px;color:#87919c;font-size:10px}.timeline-row{position:relative;height:74px;border-top:1px solid #e3e7ec}.timeline-row b{display:inline-block;width:100px;padding-top:27px;font-size:11px}.bar{position:absolute;height:18px;top:27px;border-radius:2px}.green{background:#bce6c4;border:1px solid #73b781}.violet{background:#d4b8ef;border:1px solid #9a68cc}.blue{background:#c3d4ff;border:1px solid #648ef1}.a{left:18%;width:25%}.b{left:60%;width:30%}.c{left:25%;width:18%}.d{left:52%;width:20%}.e{left:20%;width:12%}.f{left:49%;width:9%}.g{left:77%;width:12%}.tick{position:absolute;top:24px;width:3px;height:25px;background:#f07945}.t1{left:31%}.t2{left:59%}.t3{left:83%}.playhead{position:absolute;left:43%;top:88px;bottom:28px;width:1px;background:var(--cordia-blue)}
.signal-ui{position:relative;align-self:center;overflow:hidden;background:#0a1725;padding:28px 200px 28px 28px}.signal-ui header{display:flex;justify-content:space-between}.signal-ui header span{color:#9cabb9;font-size:11px}.signal-ui header em{color:#62d38e;font-style:normal}.signal-lines{display:flex;flex-direction:column;justify-content:space-around;height:390px;margin-top:30px}.signal-lines span{display:block;height:42px;background:url("data:image/svg+xml,%3Csvg viewBox='0 0 600 40' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M0 21 L18 19 25 24 31 17 40 22 47 18 55 20 64 17 69 25 76 20 84 22 93 16 101 23 109 18 118 21 126 17 135 24 143 19 153 22 163 16 174 23 184 19 195 21 208 16 221 24 234 18 248 22 261 17 276 23 291 19 306 21 322 16 338 24 354 18 370 22 388 17 405 23 423 19 441 21 460 16 478 24 496 18 514 22 532 17 550 23 568 19 585 21 600 18' fill='none' stroke='%233e7cff' stroke-width='1.4'/%3E%3C/svg%3E") center/100% 100% no-repeat;opacity:.9}.signal-lines span:nth-child(even){opacity:.48}.signal-ui aside{position:absolute;top:72px;right:0;bottom:0;width:160px;padding:28px;border-left:1px solid #293747}.signal-ui aside b{display:block;margin-bottom:28px}.signal-ui aside span{display:block;margin:16px 0;color:#a7b2bd;font-size:11px}.dot{display:inline-block;width:6px;height:6px;margin-right:8px;border-radius:50%}.blue-dot{background:#4a82f5}.green-dot{background:#58ca85}.orange-dot{background:#f1844d}
.cordia-validation{background:#fff}.validation-grid{display:grid;grid-template-columns:repeat(3,1fr);margin-top:90px;border-top:1px solid var(--cordia-line)}.validation-grid article{padding:34px 34px 0 0}.validation-grid article+article{padding-left:34px;border-left:1px solid var(--cordia-line)}.validation-grid b{font-family:var(--serif);font-size:34px;font-weight:400}.validation-grid p{color:#687480;font-size:13px;line-height:1.8}
.cordia-outcome{display:grid;grid-template-columns:.85fr 1.15fr;gap:9vw;padding:var(--section-y) var(--page-x);background:var(--cordia-dark);color:#f5f7fa}.cordia-outcome h2{margin:30px 0;font-family:var(--serif);font-size:clamp(42px,5vw,74px);font-weight:400;line-height:1.18}.cordia-outcome p{color:#aab5c1}.market-list{display:grid;grid-template-columns:repeat(2,1fr);align-content:center;border-top:1px solid #2d3b4b}.market-list span{padding:28px 0;border-bottom:1px solid #2d3b4b;color:#c7d0d9}.market-list span:nth-child(even){padding-left:28px;border-left:1px solid #2d3b4b}.cordia-reflection h2{max-width:980px;margin:40px 0;font-family:var(--serif);font-size:clamp(44px,5.5vw,82px);font-weight:400;line-height:1.17}.cordia-reflection p{max-width:700px;color:#687480;line-height:1.9}.cordia-reflection .text-link{display:inline-flex;margin-top:45px}
@media(max-width:800px){.cordia-hero{grid-template-columns:1fr;padding-top:calc(var(--header-h) + 55px)}.cordia-hero-media{margin-top:20px}.cordia-meta,.cordia-intro,.participant-grid,.finding-list,.cordia-principles,.cordia-flow ol,.cordia-showcase,.cordia-validation .validation-grid,.cordia-outcome{grid-template-columns:1fr}.cordia-meta div+div,.cordia-intro article+article,.participant-grid>div+div,.finding-list article+article,.cordia-principles li,.cordia-flow li+li,.validation-grid article+article,.market-list span:nth-child(even){padding-left:0;border-left:0}.cordia-meta div{padding:18px 0;border-bottom:1px solid var(--cordia-line)}.cordia-intro article,.cordia-intro article+article{padding:75px 0}.cordia-heading{display:block}.cordia-heading h2{margin-top:34px}.participant-grid{margin-top:65px}.participant-grid>div{min-height:0;padding:30px 0;border-bottom:1px solid var(--cordia-line)}.participant-types{flex-wrap:wrap}.finding-list{margin-top:65px}.finding-list article,.finding-list article+article{min-height:0;padding:28px 0 42px;border-bottom:1px solid var(--cordia-line)}.cordia-findings blockquote{margin-top:75px}.cordia-principles{gap:65px}.cordia-flow li,.cordia-flow li+li{padding:22px 0;border-bottom:1px solid var(--cordia-line)}.cordia-flow li:not(:last-child)::after{right:0}.cordia-flow li>span{margin-top:20px}.cordia-showcase-copy{border-right:0;border-bottom:1px solid rgba(130,145,160,.28)}.cordia-ui,.timeline-ui,.signal-ui{margin:28px 16px 70px;min-height:420px}.device-ui{grid-template-columns:95px 1fr}.device-ui aside{padding:16px 7px}.device-table{padding:16px}.device-table>div{grid-template-columns:1fr}.device-table small{display:none}.timeline-ui{padding:15px}.time-axis{padding-left:60px}.timeline-row b{width:60px}.signal-ui{padding:22px 105px 22px 16px}.signal-ui aside{width:90px;padding:18px 10px}.market-list{margin-top:60px}.validation-grid article,.validation-grid article+article{padding:28px 0;border-bottom:1px solid var(--cordia-line)}}
@media(max-width:800px){.cordia-hero{min-height:auto}.cordia-hero h1{font-size:clamp(38px,11vw,58px);line-height:1.14;letter-spacing:-.035em}.cordia-hero h1 br{display:none}.cordia-hero-copy>p{margin-top:28px;font-size:14px}.cordia-hero-media{margin-top:28px}}

/* Cordia inside the existing case-study guideline */
.cordia-case-page { --cordia-accent:#326ee8; --cordia-night:#07131f; }
.cordia-case-page .case-hero-copy em { color:var(--cordia-accent); }
.cordia-case-cover { position:relative; display:grid; place-items:center; min-height:92svh; padding:9vw var(--page-x); overflow:hidden; background:#dfe7ef; }
.cordia-case-cover::before { content:""; position:absolute; inset:0; opacity:.5; background:linear-gradient(rgba(50,110,232,.09) 1px,transparent 1px),linear-gradient(90deg,rgba(50,110,232,.09) 1px,transparent 1px); background-size:44px 44px; mask-image:linear-gradient(to bottom,transparent,#000 30%,#000 75%,transparent); }
.cordia-cover-identity { position:absolute; z-index:2; top:46px; left:var(--page-x); display:flex; align-items:baseline; gap:14px; }.cordia-cover-identity strong{font-family:var(--serif);font-size:30px;font-weight:400}.cordia-cover-identity span{color:#5f6d7a;font-size:11px;letter-spacing:.1em;text-transform:uppercase}
.cordia-cover-frame { position:relative; z-index:1; width:min(1120px,92%); overflow:hidden; border:1px solid rgba(17,37,56,.2); border-radius:12px; background:#fff; box-shadow:0 35px 90px rgba(21,43,65,.18); }.cordia-cover-frame img{display:block;width:100%;aspect-ratio:1.58/1;object-fit:cover}.cordia-cover-bar{display:flex;align-items:center;gap:6px;height:38px;padding:0 13px;border-bottom:1px solid #d9dfe5;background:#f3f5f7;color:#778492;font-size:10px}.cordia-cover-bar i{width:7px;height:7px;border-radius:50%;background:#c7cdd4}.cordia-cover-bar i:first-child{background:#ff6b62}.cordia-cover-bar i:nth-child(2){background:#f3bd4c}.cordia-cover-bar i:nth-child(3){background:#5dcc77}.cordia-cover-bar span{margin-left:10px}
.cordia-cover-type { position:absolute; z-index:1; left:50%; width:100%; color:rgba(16,42,45,.24); font-family:var(--sans); font-size:clamp(64px,10vw,188px); font-weight:400; line-height:.8; letter-spacing:-.065em; text-align:center; white-space:nowrap; opacity:0; transform:translate(-50%,30px); animation:cordia-type-reveal 1.8s both cubic-bezier(.2,.72,.2,1); }
.cordia-cover-type-top { top:4%; animation-delay:.18s; }
.cordia-cover-type-bottom { bottom:2%; animation-delay:.55s; }
.project-cordia .cordia-cover-type { z-index:1; color:rgba(16,42,45,.22); font-size:clamp(42px,8vw,126px); }
.project-cordia .cordia-cover-type-top { top:3%; }
.project-cordia .cordia-cover-type-bottom { bottom:2%; }
.project-cordia.reveal:not(.is-visible) .cordia-cover-type { animation-play-state:paused; }
@keyframes cordia-type-reveal { from { opacity:0; transform:translate(-50%,30px); filter:blur(5px); } to { opacity:1; transform:translate(-50%,0); filter:blur(0); } }
.cordia-product-showcase { background:#e7edf2; }.cordia-timeline-showcase{background:#f2f5f7}.cordia-data-showcase{background:#dce5eb}.cordia-stage{position:relative;display:grid;place-items:center;min-height:100svh;margin:0;padding:7vh 5vw;overflow:hidden;background:radial-gradient(circle at 50% 45%,rgba(255,255,255,.95),rgba(197,211,222,.45) 40%,transparent 72%)}.cordia-screen{width:min(760px,95%);overflow:hidden;border:1px solid rgba(13,37,55,.18);border-radius:14px;background:#fff;box-shadow:0 30px 80px rgba(15,38,57,.15)}.cordia-screen img{display:block;width:100%;height:auto;object-fit:contain;border-radius:14px;transition:opacity .22s ease,transform .3s ease}.cordia-screen img.is-changing{opacity:.35;transform:scale(.985)}
.cordia-product-showcase [data-cordia-project-overview],.cordia-product-showcase [data-cordia-action-overview]{cursor:pointer;transition:background-color .2s ease,padding-left .2s ease}.cordia-product-showcase [data-cordia-project-overview]:hover,.cordia-product-showcase [data-cordia-project-overview]:focus-visible,.cordia-product-showcase [data-cordia-project-overview].is-active,.cordia-product-showcase [data-cordia-action-overview]:hover,.cordia-product-showcase [data-cordia-action-overview]:focus-visible,.cordia-product-showcase [data-cordia-action-overview].is-active{padding-left:10px;background:rgba(255,255,255,.34);outline:0}
.cordia-action-gallery{display:grid;grid-template-columns:minmax(0,1.45fr) minmax(220px,.85fr);align-items:start;gap:14px;padding:14px;background:#eef2f1}.cordia-action-gallery[hidden]{display:none}.cordia-action-card{display:flex;min-width:0;margin:0;overflow:hidden;border:1px solid rgba(16,42,45,.14);border-radius:14px;background:#fff;box-shadow:0 16px 38px rgba(16,42,45,.08);flex-direction:column}.cordia-action-card img{width:100%;height:auto;min-height:0;border-radius:0;object-fit:contain;object-position:center top}.cordia-action-card figcaption{display:grid;gap:5px;padding:14px 16px 16px;border-top:1px solid rgba(16,42,45,.1)}.cordia-action-card figcaption b{color:var(--ink);font-size:12px}.cordia-action-card figcaption span{color:var(--muted);font-size:10px;line-height:1.55}
.cordia-screen > [data-cordia-showcase-image][hidden]{display:none}
@media(max-width:800px){.cordia-action-gallery{grid-template-columns:1fr;padding:10px}.cordia-action-card img{min-height:0;object-fit:contain}.cordia-action-card-wide img{aspect-ratio:663/410}}
.cordia-timeline-stage{background:radial-gradient(circle at 50% 45%,#fff,#dfe8ef 45%,transparent 74%)}.cordia-demo-timeline{position:relative;width:min(760px,96%);padding:28px;overflow:hidden;border:1px solid #cdd7df;border-radius:10px;background:#fff;box-shadow:0 30px 80px rgba(15,38,57,.13)}.cordia-demo-timeline header{display:flex;justify-content:space-between;padding-bottom:24px;border-bottom:1px solid #dce2e7}.cordia-demo-timeline header b{color:#71808e;font-size:11px}.cordia-demo-timeline>div{position:relative;height:86px;border-bottom:1px solid #e3e8ec}.cordia-demo-timeline strong{display:inline-block;width:110px;padding-top:34px;font-size:11px}.cbar{position:absolute;top:31px;height:22px;border-radius:3px}.cbar-a{left:20%;width:25%;background:#b7dfbd;border:1px solid #71af79}.cbar-b{left:60%;width:29%;background:#b7dfbd;border:1px solid #71af79}.cbar-c{left:27%;width:18%;background:#d7b8ef;border:1px solid #a272c8}.cbar-d{left:52%;width:21%;background:#d7b8ef;border:1px solid #a272c8}.cbar-e{left:21%;width:12%;background:#c7d7ff;border:1px solid #6e91e8}.cbar-f{left:67%;width:14%;background:#c7d7ff;border:1px solid #6e91e8}.cordia-playhead{position:absolute;left:47%;top:70px;bottom:28px;width:1px;background:var(--cordia-accent)}
.cordia-timeline-art{width:min(405px,96%);overflow:hidden;border:1px solid #cdd7df;border-radius:14px;background:#fff;box-shadow:0 30px 80px rgba(15,38,57,.13)}.cordia-timeline-art img{display:block;width:100%;height:auto;border-radius:14px}
.cordia-signal-stage{background:radial-gradient(circle at 50% 45%,#1a2a3a,var(--cordia-night) 48%,#040c14 80%)}.cordia-signal-panel{width:min(760px,96%);padding:28px;border:1px solid #314457;border-radius:10px;background:#091725;box-shadow:0 30px 80px rgba(0,0,0,.3);color:#edf3f8}.cordia-signal-panel header{display:flex;justify-content:space-between}.cordia-signal-panel header span{color:#69d391;font-size:11px}.cordia-waves{display:flex;flex-direction:column;justify-content:space-around;height:390px;margin-top:26px}.cordia-waves i{height:45px;background:url("data:image/svg+xml,%3Csvg viewBox='0 0 600 40' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M0 21 L18 19 25 24 31 17 40 22 47 18 55 20 64 17 69 25 76 20 84 22 93 16 101 23 109 18 118 21 126 17 135 24 143 19 153 22 163 16 174 23 184 19 195 21 208 16 221 24 234 18 248 22 261 17 276 23 291 19 306 21 322 16 338 24 354 18 370 22 388 17 405 23 423 19 441 21 460 16 478 24 496 18 514 22 532 17 550 23 568 19 585 21 600 18' fill='none' stroke='%233e7cff' stroke-width='1.4'/%3E%3C/svg%3E") center/100% 100% no-repeat}.cordia-waves i:nth-child(even){opacity:.52}
.cordia-signal-art{position:relative;width:min(600px,96%);overflow:hidden;border:1px solid #314457;border-radius:14px;background:#fff;box-shadow:0 30px 80px rgba(0,0,0,.3)}.cordia-signal-art img{display:block;width:100%;height:auto;border-radius:14px}.cordia-live-canvas{position:absolute;z-index:2;left:10%;top:11.87%;width:90%;height:88.13%;display:block}
@media(max-width:800px){.cordia-case-cover{min-height:670px;padding:100px 10px 50px}.cordia-cover-identity{top:36px}.cordia-cover-frame{width:100%;border-radius:8px}.cordia-stage{min-height:75svh;padding:50px 14px}.cordia-demo-timeline,.cordia-signal-panel{padding:18px}.cordia-timeline-art{width:min(405px,100%);border-radius:10px}.cordia-signal-art{width:100%;border-radius:10px}.cordia-timeline-art img,.cordia-signal-art img{border-radius:10px}.cordia-demo-timeline strong{width:70px}.cordia-waves{height:320px}}
@media(max-width:800px){.cordia-cover-type{font-size:clamp(46px,15vw,92px)}.cordia-cover-type-top{top:15%}.cordia-cover-type-bottom{bottom:13%}.project-cordia .project-media{padding:10% 8%}.project-cordia .cordia-cover-type{font-size:clamp(36px,12vw,74px)}}
@media(prefers-reduced-motion:reduce){.cordia-cover-type{opacity:1;transform:translate(-50%,0);filter:none;animation:none}}

/* Cordia palette alignment: use only the existing portfolio tokens */
.cordia-case-page { --cordia-accent:var(--teal); --cordia-night:var(--ink); }
.cordia-case-page .case-hero-copy em { color:var(--teal); font-style:italic; }
.cordia-case-cover { background:var(--mint); }
.cordia-case-cover { min-height:auto; padding:0; background:#fff; }
.cordia-case-cover::before { display:none; }
.cordia-case-cover .cordia-cover-svg { position:relative; z-index:1; display:block; width:100%; max-height:none; aspect-ratio:2/1; object-fit:contain; background:#fff; }
.cordia-case-cover { position:relative; display:grid; place-items:center; min-height:92svh; padding:9vw var(--page-x); overflow:hidden; background:#e5fbf5 url("assets/cordia-brain-background.png") center/cover no-repeat; }
.cordia-case-cover::before { display:block; content:""; position:absolute; inset:0; background:linear-gradient(180deg,rgba(255,255,255,.08),rgba(201,249,236,.12)); }
.cordia-case-cover .cordia-cover-frame { z-index:3; }
.cordia-case-cover .cordia-cover-frame { width:min(900px,78%); }
.cordia-case-cover .cordia-cover-frame img { width:100%; height:auto; aspect-ratio:895/510; object-fit:contain; }
.cordia-case-cover .cordia-cover-type { z-index:2; color:rgba(38,196,145,.34); }
.cordia-case-cover .cordia-cover-identity { z-index:4; }
.cordia-cover-frame img { object-position:center; }
.project-cordia .project-media { position:relative; display:grid; place-items:center; padding:7.5% 11%; background:#e5fbf5 url("assets/cordia-brain-background.png") center/cover no-repeat; }
.project-cordia .cordia-card-frame { position:relative; z-index:3; width:100%; overflow:hidden; border:1px solid rgba(16,42,45,.18); border-radius:8px; box-shadow:0 24px 54px rgba(16,42,45,.2); }
.project-cordia .cordia-card-frame img { width:100%; height:auto; aspect-ratio:895/510; object-fit:cover; }
.project-cordia .cordia-cover-type { z-index:2; color:rgba(38,196,145,.32); }
.project-cordia .media-index,.project-cordia .media-arrow { z-index:4; }
@media(max-width:800px){.cordia-case-cover{min-height:670px;padding:100px 10px 50px}.cordia-case-cover .cordia-cover-frame{width:84%}.project-cordia .project-media{padding:10% 8%}}
.cordia-case-cover::before { opacity:.42; background:linear-gradient(rgba(16,42,45,.07) 1px,transparent 1px),linear-gradient(90deg,rgba(16,42,45,.07) 1px,transparent 1px); background-size:44px 44px; }
.cordia-case-cover::before { opacity:1; background-image:linear-gradient(180deg,rgba(255,255,255,.94) 0%,rgba(255,255,255,.42) 42%,rgba(200,248,235,.34) 66%,rgba(99,224,190,.58) 100%),linear-gradient(rgba(16,42,45,.055) 1px,transparent 1px),linear-gradient(90deg,rgba(16,42,45,.055) 1px,transparent 1px); background-size:100% 100%,44px 44px,44px 44px; }

/* Shared Cordia cover component — the case page and homepage use one visual system. */
.cordia-cover-component { position:relative; display:grid; place-items:center; overflow:hidden; background:#e5fbf5 url("assets/cordia-brain-background.png") center/cover no-repeat; }
.cordia-cover-component::before { content:""; position:absolute; inset:0; opacity:1; background-image:linear-gradient(180deg,rgba(255,255,255,.94) 0%,rgba(255,255,255,.42) 42%,rgba(200,248,235,.34) 66%,rgba(99,224,190,.58) 100%),linear-gradient(rgba(16,42,45,.055) 1px,transparent 1px),linear-gradient(90deg,rgba(16,42,45,.055) 1px,transparent 1px); background-size:100% 100%,44px 44px,44px 44px; transform:none; mask-image:none; }
.cordia-cover-component .cordia-cover-frame { position:relative; z-index:3; width:min(900px,78%); }
.cordia-cover-component .cordia-cover-frame img { display:block; width:100%; height:auto; aspect-ratio:895/510; object-fit:contain; }
.cordia-cover-component .cordia-cover-type { z-index:2; color:rgba(38,196,145,.34); }
.project-cordia .cordia-cover-component { min-height:0; aspect-ratio:2/1; padding:0; }
.project-cordia .cordia-cover-component .cordia-cover-frame { width:58%; border-radius:8px; }
.project-cordia .cordia-cover-component .cordia-cover-bar { height:28px; padding:0 10px; font-size:8px; }
.project-cordia .cordia-cover-component .cordia-cover-bar i { width:5px; height:5px; }
.project-cordia .cordia-cover-component .cordia-cover-type { font-size:clamp(42px,8vw,126px); }
@media(max-width:800px){.cordia-cover-component .cordia-cover-frame{width:84%}.project-cordia .cordia-cover-component .cordia-cover-frame{width:58%}}
.project-cordia .project-media:hover img { transform:none; filter:none; }
.project-cordia .cordia-cover-type-bottom { color:#fff; }
.cordia-case-cover .cordia-cover-type-bottom { color:#fff; }

/* Shared Lilia Neuro cover background supplied by the user. */
.project-lilia .project-media,.case-cover-product { background:#eef4f2 url("assets/lilia-cover-background.png") center/cover no-repeat; }
.project-lilia .project-media::before,.project-lilia .project-media::after,.case-cover-product::before,.case-cover-product::after { display:none; }
.case-cover-product .neuro-field { display:none; }
.case-cover-product { min-height:92svh; }
.case-cover-product .lilia-cover-type { z-index:2; }
.project-lilia .project-media img { z-index:2; opacity:1; mix-blend-mode:normal; background:transparent; }
.lilia-cover-type { position:absolute; z-index:1; left:50%; width:100%; color:rgba(93,139,136,.58); font-family:var(--sans); font-size:clamp(54px,9vw,150px); font-weight:400; line-height:.8; letter-spacing:-.065em; text-align:center; white-space:nowrap; opacity:0; transform:translate(-50%,30px); animation:cordia-type-reveal 1.8s both cubic-bezier(.2,.72,.2,1); }
.lilia-cover-type-top { top:3%; animation-delay:.18s; }
.lilia-cover-type-bottom { bottom:2%; color:#fff; animation-delay:.55s; }
.project-lilia.reveal:not(.is-visible) .lilia-cover-type { animation-play-state:paused; }
@media(max-width:800px){.lilia-cover-type{font-size:clamp(38px,12vw,76px)}}

/* Airier display typography across the portfolio. */
h1,
h2,
.project-info h3,
.large-copy,
.case-quote p,
.core-insight p,
.case-next p,
.insight-card h3,
.challenge-grid h3,
.experience-rail h3,
.principles strong,
.showcase-points strong,
.outcome-list strong,
.about-fact-grid h3,
.cordia-hero h1,
.cordia-intro h2,
.cordia-heading h2,
.cordia-findings blockquote,
.cordia-principles h2,
.cordia-showcase-copy h2,
.cordia-outcome h2,
.cordia-reflection h2,
.decision-grid h2 {
  letter-spacing: .025em;
  line-height: 1.34;
}

.project-info h3 { line-height: 1.18; }
.large-copy,
.case-quote p,
.core-insight p,
.cordia-findings blockquote { line-height: 1.45; }

.cordia-cover-type,
.lilia-cover-type {
  letter-spacing: .015em;
  line-height: .96;
}

@media (max-width: 800px) {
  h1,
  h2,
  .cordia-hero h1,
  .case-section h2,
  .section-heading h2,
  .about-story h2,
  .about-interests h2,
  .about-contact h2 {
    letter-spacing: .018em;
    line-height: 1.38;
  }
}
@media(prefers-reduced-motion:reduce){.lilia-cover-type{opacity:1;transform:translate(-50%,0);animation:none}}
.cordia-product-showcase { background:var(--mint); }
.cordia-timeline-showcase { background:#eef3f1; }
.cordia-data-showcase { background:var(--mint); }
.cordia-stage { background:radial-gradient(circle at 50% 45%,rgba(255,255,255,.95),rgba(168,196,192,.35) 40%,transparent 72%); }
.cordia-screen { border-color:rgba(16,42,45,.18); box-shadow:0 30px 80px rgba(16,42,45,.13); }
.cordia-timeline-stage { background:radial-gradient(circle at 50% 45%,#fff,rgba(190,211,207,.42) 45%,transparent 74%); }
.cbar-a,.cbar-b { background:#cfe1de; border-color:#86aaa5; }
.cbar-c,.cbar-d { background:#a8c4c0; border-color:#5f8e89; }
.cbar-e,.cbar-f { background:#e2ebe9; border-color:#9ab6b2; }
.cordia-playhead { background:var(--teal); }
.cordia-signal-stage { background:radial-gradient(circle at 50% 45%,#17363a,var(--ink) 48%,#08191c 80%); }
.cordia-signal-panel { border-color:rgba(220,232,229,.25); background:#0d282c; color:var(--paper); }
.cordia-signal-panel header span { color:var(--sage); }
.cordia-waves i { filter:hue-rotate(115deg) saturate(.35) brightness(1.3); }

/* Homepage hero — playful portrait with mint line-art interests. */
.hero-playful{min-height:100svh;background:#f5f7f5;isolation:isolate}
.hero-playful .hero-art{position:absolute;inset:0;min-height:100svh;background:#f5f7f5;overflow:hidden;transform-origin:center top}
.hero-playful .hero-art::after{display:none}
.hero-name{position:absolute;z-index:1;inset:12vh 2.5vw auto;display:flex;justify-content:space-between;align-items:flex-start;max-width:none;margin:0;color:#a8c4c0;font-family:var(--sans);font-size:clamp(150px,21.5vw,340px);font-weight:500;line-height:.78;letter-spacing:-.085em;white-space:nowrap;pointer-events:none}
.hero-name span:last-child{padding-right:.03em}
.hero-playful .hero-art::before{display:none}
.hero-portrait-wrap{position:absolute;z-index:3;left:50%;bottom:-1px;width:min(38vw,560px);height:min(79svh,760px);transform:translateX(-50%);display:flex;align-items:flex-end;justify-content:center;filter:drop-shadow(0 24px 28px rgba(16,42,45,.11));animation:hero-portrait-breathe 6s ease-in-out infinite}
.hero-portrait{display:block;width:100%;height:100%;object-fit:contain;object-position:center bottom}
.hero-selection-frame{position:absolute;z-index:4;left:50%;top:26%;width:min(61vw,900px);height:58%;border:2px solid var(--teal);transform:translateX(-50%);pointer-events:none;animation:hero-frame-in 1s cubic-bezier(.2,.72,.2,1) both}
.hero-selection-frame::before{content:"";position:absolute;inset:0;background:rgba(255,255,255,.025);box-shadow:0 0 0 100vmax rgba(16,42,45,.13);pointer-events:none}
.hero-selection-frame i{position:absolute;width:10px;height:10px;border:2px solid var(--paper);background:var(--teal);box-shadow:0 0 0 1px var(--teal)}
.hero-selection-frame i:nth-child(1){left:-5px;top:-5px}.hero-selection-frame i:nth-child(2){left:50%;top:-5px}.hero-selection-frame i:nth-child(3){right:-5px;top:-5px}.hero-selection-frame i:nth-child(4){left:-5px;top:50%}.hero-selection-frame i:nth-child(5){right:-5px;top:50%}.hero-selection-frame i:nth-child(6){left:-5px;bottom:-5px}.hero-selection-frame i:nth-child(7){left:50%;bottom:-5px}.hero-selection-frame i:nth-child(8){right:-5px;bottom:-5px}
.hero-info-tag{position:absolute;z-index:5;display:inline-flex;align-items:center;min-height:42px;padding:9px 22px;border-radius:999px;background:var(--ink);color:var(--paper);font-size:13px;font-weight:600;letter-spacing:.04em;white-space:nowrap;box-shadow:0 10px 24px rgba(16,42,45,.12);animation:hero-tag-float 5s ease-in-out infinite}
.hero-info-role{left:0;top:0;background:#c5ef55;color:var(--ink);font-size:16px;transform:translate(-42%,-50%) rotate(-5deg)}
.hero-info-years{right:0;top:50%;background:#c5ef55;color:var(--ink);font-size:15px;transform:translate(50%,-50%) rotate(5deg);animation-delay:-1.2s}
.hero-info-systems{left:0;top:68%;transform:translate(-50%,-50%) rotate(-3deg);animation-delay:-2.4s}
.hero-info-location{right:0;bottom:12%;transform:translate(50%,50%) rotate(3deg);background:var(--sage);color:var(--ink);animation-delay:-3.4s}
.hero-info-vibe{left:24%;bottom:0;transform:translate(-50%,50%) rotate(-4deg);background:var(--ink);color:var(--paper);animation-delay:-4.1s}
.hero-playful .hero-copy{position:absolute;z-index:4;left:var(--page-x);bottom:11vh;width:min(310px,24vw);min-height:0;padding:0;background:none;display:block}
.hero-playful .hero-art>.hero-role{position:absolute;z-index:1;left:50%;bottom:4vh;width:98vw;margin:0;transform:translateX(-50%) scaleX(1.025);color:rgba(168,196,192,.64);font-family:var(--sans);font-size:clamp(92px,13.4vw,230px);font-weight:500;line-height:.8;letter-spacing:-.085em;text-align:center;white-space:nowrap;pointer-events:none}
.hero-frame-intro{position:absolute;z-index:5;left:5%;top:12%;width:min(340px,38%);margin:0;color:var(--ink);font-size:clamp(16px,1.2vw,19px);line-height:1.75;text-align:left}
.hero-playful .hero-intro{margin:0 0 26px;color:var(--ink);font-size:13px;line-height:1.8}
.hero-playful .hero-frame-intro{margin:0;font-size:clamp(16px,1.2vw,19px);line-height:1.75}
.hero-playful .text-link{font-size:11px}
.hero-playful .hero-footer{z-index:5;justify-content:center;text-align:center}
.hero-playful .hero-footer .scroll-note{display:inline-flex;align-items:center;gap:13px;padding:11px 18px;border:1px solid rgba(255,255,255,.94);border-radius:999px;background:rgba(245,247,245,.88);box-shadow:0 8px 24px rgba(16,42,45,.18);backdrop-filter:blur(10px);color:var(--ink);font-size:11px;font-weight:600;letter-spacing:.08em;animation:hero-scroll-pulse 2.6s ease-in-out infinite}
.hero-playful .hero-footer .scroll-note span{margin:0;font-size:17px;animation:hero-scroll-arrow 1.3s ease-in-out infinite}
@keyframes hero-sketch-drift{0%{transform:translate3d(-5px,3px,0) rotate(-.15deg)}100%{transform:translate3d(7px,-5px,0) rotate(.15deg)}}
@keyframes hero-portrait-breathe{0%,100%{transform:translateX(-50%) translateY(0)}50%{transform:translateX(-50%) translateY(-7px)}}
@keyframes hero-frame-in{from{opacity:0;transform:translateX(-50%) scale(.94)}to{opacity:1;transform:translateX(-50%) scale(1)}}
@keyframes hero-tag-float{0%,100%{margin-top:0}50%{margin-top:-7px}}
@keyframes hero-scroll-pulse{0%,100%{box-shadow:0 8px 24px rgba(16,42,45,.16);transform:translateY(0)}50%{box-shadow:0 13px 32px rgba(16,42,45,.26);transform:translateY(-3px)}}
@keyframes hero-scroll-arrow{0%,100%{transform:translateY(-2px)}50%{transform:translateY(4px)}}
@media(max-width:800px){
  .hero-playful{min-height:100svh}
  .hero-playful .hero-art{min-height:100svh;border:0}
  .hero-name{inset:17vh 10px auto;display:block;font-size:clamp(108px,35vw,190px);line-height:.7;text-align:center;white-space:normal}
  .hero-name span{display:block}.hero-name span:last-child{margin-top:.14em}
  .hero-playful .hero-art>.hero-role{top:auto;bottom:10vh;width:98vw;font-size:clamp(52px,13.7vw,92px);white-space:nowrap;line-height:.84}
  .hero-playful .hero-art{background-position:center top}
  .hero-selection-frame{top:31%;width:86vw;height:53%}
  .hero-info-role{left:0;top:0;transform:translate(-12%,-50%) rotate(-5deg)}.hero-info-years{right:0;top:50%;transform:translate(12%,-50%) rotate(5deg)}.hero-info-systems{left:0;top:70%;transform:translate(-12%,-50%) rotate(-3deg)}.hero-info-location{display:none}
  .hero-info-vibe{left:22%;bottom:0;transform:translate(-20%,50%) rotate(-4deg)}
  .hero-frame-intro{left:5%;top:10%;width:58%;font-size:13px;line-height:1.65}
  .hero-portrait-wrap{width:min(78vw,430px);height:64svh;bottom:0}
  .hero-playful .hero-copy{left:var(--page-x);bottom:76px;width:min(260px,68vw);padding:0;background:none}
  .hero-playful .hero-intro{font-size:12px;line-height:1.65;margin-bottom:18px}
  .hero-playful .hero-frame-intro{margin:0;font-size:13px;line-height:1.65}
  .hero-playful .hero-footer{display:flex;bottom:22px}
}
@media(prefers-reduced-motion:reduce){.hero-playful .hero-art::before,.hero-portrait-wrap,.hero-selection-frame,.hero-info-tag,.hero-playful .hero-footer .scroll-note,.hero-playful .hero-footer .scroll-note span{animation:none}}
.language-switcher {
  display: inline-flex;
  align-items: center;
  gap: .35rem;
  margin-left: auto;
  margin-right: 1.25rem;
  color: currentColor;
  font-size: .72rem;
  font-weight: 600;
  letter-spacing: .06em;
  white-space: nowrap;
}

.language-switcher button {
  appearance: none;
  border: 0;
  padding: .3rem .15rem;
  background: transparent;
  color: inherit;
  font: inherit;
  cursor: pointer;
  opacity: .45;
  transition: opacity .2s ease;
}

.language-switcher button:hover,
.language-switcher button:focus-visible,
.language-switcher button.is-active { opacity: 1; }

@media (max-width: 720px) {
  .language-switcher { margin-right: 0; }
}

@media (max-width: 520px) {
  .site-header .nav-links { display: none; }
  .site-header .language-switcher { margin-left: auto; }
}