header{display:grid;grid-template-columns:1fr auto 1fr;gap:24px;min-height:106px;height:auto;padding-top:22px;padding-bottom:22px;align-items:center}.logo small{font-size:12px;letter-spacing:.3px;font-weight:400;display:block;margin-top:7px}.brand-line{font-family:Georgia,serif;font-style:italic;font-size:17px;white-space:nowrap}header nav{justify-self:end;gap:24px}.home-page{--deck-bg:#11110f;--deck-fg:#f8bf10;--deck-secondary:#b6b5a5;background:#11110f;isolation:isolate}.home-page[data-deck-theme=light]{--deck-bg:#f8bf10;--deck-fg:#11110f;--deck-secondary:#34352b}.home-page>header,.home-page .deck-hero{background:transparent;color:var(--deck-fg);transition:color .65s}.home-page header .nav-contact{border-color:currentColor}.home-page header .nav-contact:hover{background:var(--deck-fg);color:var(--deck-bg)}.deck-hero{display:flex;flex-direction:column;gap:0;min-height:0;padding:18px 6% 50px;position:relative;overflow:hidden;isolation:isolate}.deck-intro{text-align:center;margin-bottom:40px}.deck-intro h1{font-size:clamp(40px,4.7vw,72px);margin:14px 0 0;line-height:1.05;letter-spacing:-.055em}.deck-intro h1 em{font-weight:400;font-family:Georgia,serif}.deck-column{width:min(390px,70vw);padding:0;margin:0;position:relative;z-index:2}.deck-label{font-size:10px;letter-spacing:1.2px;color:var(--deck-secondary);margin:0 0 24px;transition:color .65s}.swipe-deck{aspect-ratio:2/3;width:100%;perspective:none;overflow:visible;outline-offset:22px}.swipe-card{border-radius:27px;background:var(--yellow);color:#11110f;border:1px solid #f8bf10;padding:16px;box-shadow:0 18px 48px #0003;transform-origin:50% 75%;transform:translate(calc(var(--order)*4px),calc(var(--order)*5px)) rotate(calc(var(--order)*2.1deg));transition:transform .58s cubic-bezier(.22,1,.36,1);opacity:1!important}.swipe-card[data-color=black]{background:#11110f;color:var(--yellow);border-color:#11110f}.swipe-card[data-color=yellow]{background:var(--yellow);color:#11110f;border-color:var(--yellow)}.swipe-card a{color:inherit}.swipe-photo{border-radius:14px;flex:1;min-height:0;background:#222}.swipe-photo img{object-fit:cover}.swipe-caption{padding:21px 3px 5px;min-height:116px;align-items:start;gap:12px}.swipe-caption strong{font-size:27px;letter-spacing:-.85px}.swipe-caption small{font-size:13px;line-height:1.5;margin-top:6px;max-width:245px}.card-year{font-size:11px;margin-top:4px}.card-year b{font-size:12px;margin-top:32px;border-bottom:1px solid currentColor;font-weight:400}.swipe-card.is-dragging{transition:none}.deck-controls{margin-top:52px;gap:10px}.deck-controls button{border-color:currentColor;color:inherit;padding:11px 18px;font-size:13px}.deck-controls button:hover{background:var(--deck-fg);color:var(--deck-bg)}.deck-controls>span{display:block;font-size:11px;color:var(--deck-secondary);max-width:110px}.deck-bottom{display:flex;align-items:center;flex-direction:column;gap:27px;margin-top:45px}.archive-toggle{font:inherit;color:inherit;background:none;border:1px solid currentColor;border-radius:50px;padding:15px 24px;cursor:pointer;font-size:15px;display:flex;gap:25px;align-items:center}.archive-toggle span{font-size:22px;line-height:1}.archive-toggle[aria-expanded=true] span{transform:rotate(45deg)}.archive-toggle:hover{background:var(--deck-fg);color:var(--deck-bg)}.scroll-invitation{font-size:12px;letter-spacing:.4px;color:var(--deck-secondary);padding:10px}.scroll-invitation::after{content:'';display:block;width:1px;height:25px;background:currentColor;margin:12px auto 0}.orbit-archive{background:#080909;padding-top:65px}.orbit-heading{align-items:center}.orbit-heading h2{font-size:clamp(47px,6.5vw,94px);line-height:1.05;letter-spacing:-.06em;margin-bottom:15px}.orbit-heading p{font-size:14px;margin-bottom:12px}.orbit-heading .eyebrow{font-size:10px;letter-spacing:1.4px;color:#999b91}.orbit-toolbar{padding-top:24px}.orbit-stage{height:clamp(480px,57vw,780px);perspective:none;margin-top:12px;background:#080909;cursor:grab;touch-action:pan-y}.orbit-stage.dragging{cursor:grabbing}.orbit-stage.is-over-project{cursor:pointer}.immersive-canvas{display:block;width:100%;height:100%;outline:none}.orbit-shade{background:radial-gradient(ellipse at center,transparent 32%,#08090944 67%,#080909 100%),linear-gradient(#080909 0,transparent 12%,transparent 83%,#080909 100%);z-index:2}.orbit-guide{bottom:22px;font-size:10px;letter-spacing:2.5px;color:#989c91}.orbit-bottom{padding-top:18px;padding-bottom:30px;align-items:center}.orbit-selection{min-width:220px}.orbit-selection .eyebrow{font-size:9px;color:#808579;letter-spacing:1.2px;margin-bottom:10px}.orbit-selected-link strong{font-size:23px;letter-spacing:-.6px;font-weight:600;display:block;color:var(--paper)}.orbit-selected-link span{display:block;font-size:12px;color:#a8ac9f;margin-top:5px}.orbit-bottom a{border:0}.orbit-selected-link:hover strong{color:var(--yellow)}.orbit-status{font-size:11px;color:#818778;max-width:260px;text-align:center;line-height:1.5}.archive-close{font:inherit;font-size:12px;background:none;color:#b9bdae;border:1px solid #4e5445;border-radius:30px;cursor:pointer;padding:11px 19px;white-space:nowrap}.orbit-list{min-height:300px}.home-page .about{background:#11110f;color:var(--paper);padding-top:100px;padding-bottom:105px;gap:9%;border-radius:0;align-items:center}.home-page .about-image{width:100%;max-width:490px;transform:rotate(-4deg);margin:auto}.home-page .about-image img,.home-page .about-image:hover img{border-radius:0;aspect-ratio:auto;object-fit:contain;width:100%;height:auto;max-height:580px;background:none}.home-page .about h2{font-size:clamp(45px,4.7vw,70px);margin:0 0 30px}.home-page .about-text p{font-size:19px;line-height:1.6;color:#c5c5bc}.home-page .about-text p strong{color:var(--paper);font-weight:700}.home-page .about .text-link{font-size:15px;border-color:var(--yellow)}.home-page .awards{background:var(--paper);padding-top:90px}.home-page footer{background:var(--paper)}.motion-off .home-page>header,.motion-off .deck-hero{transition:none!important}
@media(min-width:1500px){.deck-column{width:410px}.deck-intro h1{font-size:72px}}
@media(max-width:1050px){header{grid-template-columns:1fr 1fr}.brand-line{display:block;grid-column:1/-1;grid-row:2;font-size:14px;text-align:center}header nav{grid-column:2;grid-row:1}.deck-column{width:360px}.deck-intro h1{font-size:55px}.swipe-caption strong{font-size:26px}.orbit-selection{min-width:180px}}
@media(max-width:650px){header{gap:15px;padding:19px 6%;min-height:100px;position:relative;align-items:start;grid-template-columns:1fr auto}.logo small{font-size:11px;margin-top:6px}.home-page header .brand-line{display:block;position:absolute;left:6%;bottom:13px;font-size:12px}.home-page header{padding-bottom:35px;min-height:115px}.brand-line{font-size:12px}header nav{gap:17px;font-size:12px;padding-top:4px}.deck-hero{padding:10px 6% 40px}.deck-intro{margin-bottom:31px}.deck-intro h1{font-size:clamp(35px,8.5vw,53px);margin-top:10px}.deck-column{width:min(300px,76vw);margin:0;padding:0}.deck-label{font-size:9px;margin-bottom:20px;letter-spacing:.6px}.swipe-card{padding:12px;border-radius:23px}.swipe-photo{border-radius:12px}.swipe-caption{padding:18px 1px 3px;min-height:96px}.swipe-caption strong{font-size:24px}.swipe-caption small{font-size:12px;max-width:190px}.card-year{font-size:10px}.card-year b{font-size:11px;margin-top:25px}.deck-controls{margin-top:46px;gap:8px}.deck-controls button{font-size:12px;padding:10px 13px}.deck-controls>span{font-size:10px;max-width:88px}.deck-bottom{margin-top:35px;gap:15px}.archive-toggle{font-size:14px;padding:14px 22px}.scroll-invitation{font-size:11px}.orbit-archive{padding-top:45px}.orbit-heading h2{font-size:54px}.orbit-heading p{font-size:13px}.orbit-stage{height:480px}.orbit-bottom{display:grid;grid-template-columns:1fr auto;gap:22px;padding-bottom:35px}.orbit-selection{min-width:0}.orbit-selected-link strong{font-size:21px}.orbit-status{grid-column:1/-1;grid-row:2;text-align:left;max-width:none;font-size:10px}.archive-close{font-size:11px;padding:10px 13px}.home-page .about{padding:60px 6%;gap:42px}.home-page .about-image{max-width:310px;width:88%}.home-page .about h2{font-size:47px}.home-page .about-text p{font-size:18px;line-height:1.6}.home-page .awards{padding-top:60px}}
/* Tight photographic crops: exclude the award ribbon and the baked-in headline. */
.swipe-card[data-card="0"] .swipe-photo img{transform:scale(1.25);transform-origin:50% 75%;object-position:50% 50%}
.swipe-card[data-card="1"] .swipe-photo img{object-position:76% 50%;transform:scale(1.32);transform-origin:100% 100%}

/* Contact disclosure and native email delivery form. */
.contact-bottom{align-items:flex-start;gap:40px}.contact-compose{width:min(100%,620px)}.contact-compose>summary{list-style:none;cursor:pointer;display:table;margin-left:auto}.contact-compose>summary::-webkit-details-marker{display:none}.contact-compose>summary:focus-visible{outline:3px solid currentColor;outline-offset:5px}.contact-compose[open]>summary{margin-bottom:30px}.contact-form{text-align:left;border-top:1px solid #1117;padding-top:28px;animation:contact-reveal .3s ease-out}.contact-form h3{font-size:30px;letter-spacing:-1px;margin:0 0 26px}.contact-fields{display:grid;grid-template-columns:1fr 1fr;gap:20px}.contact-form label{display:block;font-size:15px;line-height:1.4;margin-bottom:22px}.contact-form input:not([type=hidden]),.contact-form textarea{box-sizing:border-box;display:block;width:100%;margin-top:9px;background:#fff5;border:1px solid #1118;border-radius:12px;color:#111;font:inherit;font-size:16px;padding:14px;outline-offset:3px}.contact-form textarea{resize:vertical;min-height:150px}.contact-form input:focus,.contact-form textarea:focus{outline:2px solid #111}.contact-form textarea::placeholder{color:#514b36}.contact-form .contact-note,.contact-form .contact-direct{font-size:13px;line-height:1.6;margin:0 0 22px;max-width:none}.contact-form .contact-direct{margin:20px 0 0;overflow-wrap:anywhere}.contact-form p a{text-decoration:underline;text-underline-offset:3px}.contact-form .contact-honey{display:none!important}.contact-form button{cursor:pointer;font:inherit}.contact-compose[open]>summary::after{content:' −';margin-left:14px}@keyframes contact-reveal{from{transform:translateY(-12px)}to{transform:translateY(0)}}@media(max-width:700px){.contact-bottom{display:flex;flex-direction:column;gap:25px}.contact-compose{width:100%}.contact-compose>summary{margin-left:0}.contact-fields{grid-template-columns:1fr;gap:0}.contact-form h3{font-size:27px}}@media(prefers-reduced-motion:reduce){.contact-form{animation:none}}.motion-off .contact-form{animation:none}

/* A single persistent backdrop owns the theme. Only the yellow layer's opacity
   changes; moving cards never invalidate or resize the background surface. */
.deck-backdrop{position:fixed;inset:0;z-index:-1;background:#11110f;pointer-events:none}
.deck-backdrop::before{content:"";position:absolute;inset:0;background:#f8bf10;opacity:0;will-change:opacity;transition:opacity .65s cubic-bezier(.4,0,.2,1)}
.home-page[data-deck-theme=light]>.deck-backdrop::before{opacity:1}
.home-page>main{background:transparent}
/* Keep the lower sections and the contact curve independent of the deck theme. */
.home-page .page-rest{position:relative;z-index:1;background:var(--paper)}

/* Header without the former central tagline. */
.home-page>header{grid-template-columns:1fr auto}
@media(max-width:650px){.home-page>header{padding-bottom:19px;min-height:90px}}

/* Single drag instruction below the card deck. */
.home-page .deck-controls{justify-content:center}
.home-page .deck-controls>span{max-width:none;font-size:12px;white-space:nowrap}


/* Portrait interaction: original aligned sources; no image distortion. */
.portrait-interaction{position:relative;width:100%;aspect-ratio:1086 / 1448}
#portrait-scene{display:block;width:100%;height:100%;overflow:visible}
#grab-glasses{position:absolute;left:21%;top:36%;width:68%;height:16%;margin:0;padding:0;border:0;background:none;cursor:grab;touch-action:none;user-select:none;-webkit-user-select:none}
#grab-glasses:focus-visible{outline:2px solid #f8bf10;outline-offset:4px}
#grab-glasses:disabled{pointer-events:none}
.home-page .about{position:relative}
.home-page .about>#glasses-hint{display:block;position:absolute;top:24px;left:4.6%;right:4.6%;background:none;padding:0;white-space:normal;font-size:12px;line-height:18px;min-height:18px;letter-spacing:0;text-align:left;margin:0;color:#73736a;pointer-events:none}
@media(max-width:650px){.home-page .about>#glasses-hint{left:6%;right:6%}}
.portrait-flying{position:fixed;left:0;top:0;pointer-events:none;z-index:99999;transform-origin:center;will-change:transform}

.portrait-flying img{display:block;width:100%;height:100%;pointer-events:none;user-select:none;-webkit-user-drag:none}

/* Keep clipping stable through drag, flight and rest: changing it during the
   background transition can rebuild the painted surface mid-frame. */
.home-page .swipe-deck{touch-action:none}
.home-page .deck-hero{overflow:visible}
/* Clip the resting stack at the mobile viewport edge without creating a
   horizontal scroll container. Keep vertical flight visible in both states. */
@media(max-width:760px){
  .home-page .deck-hero{overflow-x:clip;overflow-y:visible}
}

.swipe-card.is-flying,.swipe-card.is-dragging{transition:none!important;will-change:transform}

/* Recognition stays on the card, below the photograph and campaign caption. */
.card-awards{display:flex;align-items:center;gap:17px;flex:0 0 43px;min-width:0;padding:10px 2px 0;border-top:1px solid currentColor}
.card-award{display:flex;align-items:center;justify-content:center;min-width:0;flex:0 1 62px;height:30px}
.award-logo{display:block;max-width:100%;width:auto;height:auto;max-height:30px;object-fit:contain;filter:brightness(0);pointer-events:none;user-select:none}
.swipe-card[data-color=black] .award-logo{filter:brightness(0) invert(1)}
.award-logo--solid{filter:grayscale(1) contrast(3);mix-blend-mode:multiply}
.swipe-card[data-color=black] .award-logo--solid{filter:grayscale(1) contrast(3) invert(1);mix-blend-mode:screen}
.award-logo--negative{filter:invert(1);mix-blend-mode:multiply}
.swipe-card[data-color=black] .award-logo--negative{filter:none;mix-blend-mode:screen}
.swipe-card[data-project=emotional-pulse] .swipe-photo img{object-position:90% 50%;transform:none}
.swipe-card[data-project=relatos-asisa] .swipe-photo img{object-position:0 50%;transform:scale(1.38);transform-origin:0 38%}
@media(max-width:650px){.card-awards{gap:13px;flex-basis:37px;padding-top:8px}.card-award{height:26px;flex-basis:50px}.award-logo{max-height:26px}}

/* Agency experience: quiet monochrome signatures below the trajectory link. */
.home-page .agency-logos{display:flex;flex-wrap:wrap;align-items:center;gap:20px 24px;list-style:none;margin:32px 0 0;padding:0}
.home-page .agency-logos li{display:flex;align-items:center;justify-content:flex-start;height:32px;margin:0;padding:0}
.home-page .agency-logos img{display:block;max-width:100%;height:auto;max-height:30px;object-fit:contain;filter:brightness(0) invert(1);opacity:.6}
.home-page .agency-vml{width:58px}.home-page .agency-wunderman{width:108px}.home-page .agency-cheil{width:62px}.home-page .agency-yslandia{width:90px}.home-page .agency-ogilvy{width:76px}
@media(max-width:650px){.home-page .agency-logos{gap:18px 22px;margin-top:28px}}

.home-page .agency-logos .agency-wunderman{height:38px}
.home-page .agency-logos .agency-wunderman img{max-height:38px}

/* The home header is in normal flow at every width; anchors need no offset. */
html:has(body.home-page){scroll-padding-top:0}
.home-page .deck-hero{padding-top:10px}
.home-page .deck-intro{margin-bottom:24px}
.home-page .deck-intro h1{font-size:clamp(36px,4vw,60px);line-height:1.02;margin-top:8px}
@media(max-width:1050px) and (min-width:651px){.home-page .deck-intro h1{font-size:46px}}
@media(max-width:650px){
  .home-page .deck-hero{padding-top:4px}
  .home-page .deck-intro{margin-bottom:14px}
  .home-page .deck-intro h1{font-size:clamp(26px,6.375vw,40px);line-height:1.02;margin-top:6px}
  .home-page .deck-label{margin-bottom:14px}
}

/* Keep the home mark and social icons on one row, including narrow phones. */
.home-page footer.portfolio-footer{display:flex;flex-direction:row;flex-wrap:nowrap;align-items:center;justify-content:space-between;gap:12px}
.portfolio-footer .footer-socials{display:flex;align-items:center;gap:8px;flex-shrink:0;margin-left:auto}
.portfolio-footer .footer-socials a{display:inline-flex;align-items:center;justify-content:center;width:44px;height:44px;padding:10px;color:inherit}
.portfolio-footer .footer-socials svg{display:block;width:24px;height:24px;flex-shrink:0}
.portfolio-footer .footer-socials a:hover{opacity:.65}
@media(max-width:360px){.portfolio-footer .footer-socials{gap:0}}

/* Stable play artwork: no platform emoji and no flex compression. */
.video-launch .play-symbol{flex:0 0 auto;aspect-ratio:1;padding:0;line-height:1}
.play-symbol svg{display:block;width:36%;height:36%;overflow:visible}
@media(hover:none){.video-launch:hover .play-symbol{transform:none;border-radius:50%}}
/* Extend section backgrounds through the iPhone landscape safe areas;
   inset only their content so text and controls clear the camera cutout. */
@media(orientation:landscape) and (pointer:coarse){
  body>header,body>footer,.deck-hero,.about,.awards,.contact,.case-hero,.case-story,.case-pieces,.case-awards,.next-case{
    padding-left:max(5%,calc(env(safe-area-inset-left,0px) + 12px));
    padding-right:max(5%,calc(env(safe-area-inset-right,0px) + 12px));
  }
  #showreel-intro .showreel-bar{
    padding-left:max(4.6%,calc(env(safe-area-inset-left,0px) + 12px));
    padding-right:max(4.6%,calc(env(safe-area-inset-right,0px) + 12px));
  }
}

.about-career-links{display:flex;align-items:center;gap:14px;flex-wrap:wrap}.about-career-links .cv-download{display:inline-flex;align-items:center;justify-content:center;flex:0 0 auto;gap:8px;min-height:44px;color:inherit;text-decoration:none;border:0;background:transparent}.cv-download:hover{opacity:.65}.cv-download:focus-visible{outline:2px solid currentColor;outline-offset:3px}
/* About links share a text baseline and only retain the yellow rule. */
.about-career-links{margin-top:15px;gap:18px}
.home-page .about-career-links>a{display:inline-flex;align-items:center;gap:8px;position:relative;min-height:44px;margin:0;padding:0;border:0;font-size:15px;line-height:20px;font-weight:700;text-decoration:none}
.home-page .about-career-links>a:hover{text-decoration:none}
.about-career-links>.text-link::after{content:"";position:absolute;left:0;right:0;bottom:5px;height:1px;background:var(--yellow)}
.about-career-links strong{font:inherit}
.about-career-links svg{display:block;flex:none}