:root { color-scheme: light; --ink:#15263a; --paper:#f7f3eb; --cream:#e9e3d8; --line:#c9c3b8; --blue:#293e58; --lime:#d8e47c; --max:1380px; }
    * {box-sizing:border-box}
    html {scroll-behavior:smooth}
    body {margin:0;background:var(--paper);color:var(--ink);font-family:"DM Sans",sans-serif;font-size:16px;line-height:1.55;-webkit-font-smoothing:antialiased}
    a {color:inherit;text-decoration:none}
    a:focus-visible {outline:2px solid var(--lime);outline-offset:5px}
    ::selection {background:var(--lime);color:var(--ink)}
    .container {width:min(calc(100% - 80px),var(--max));margin-inline:auto}
    .site-header {position:fixed;top:0;left:0;right:0;z-index:5;color:var(--paper);transition:background .25s ease,box-shadow .25s ease}
    .site-header.scrolled {background:rgba(21,38,58,.96);box-shadow:0 10px 30px rgba(12,27,43,.12);backdrop-filter:blur(12px)}
    section[id] {scroll-margin-top:110px}
    .header-inner {min-height:110px;display:flex;align-items:center;justify-content:space-between;gap:32px;border-bottom:1px solid rgba(247,243,235,.3)}
    .brand {display:inline-flex;gap:15px;align-items:center;flex-shrink:0}
    .mark {width:50px;height:45px;display:block;flex:none;background:currentColor;-webkit-mask:url('/sigle-guillemets.png') center / 230% auto no-repeat;mask:url('/sigle-guillemets.png') center / 230% auto no-repeat}
    .quote-half {display:inline-block;flex:none;background:currentColor;-webkit-mask-image:url('/sigle-guillemets.png');mask-image:url('/sigle-guillemets.png');-webkit-mask-size:460% auto;mask-size:460% auto;-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat}
    .quote-open {-webkit-mask-position:37% center;mask-position:37% center}
    .quote-close {-webkit-mask-position:65% center;mask-position:65% center}
    .brand-type {display:flex;flex-direction:column;line-height:1}
    .brand-name {font-family:"Playfair Display",Georgia,serif;font-size:26px;letter-spacing:-.055em;white-space:nowrap}
    .brand-sub {font:600 9px/1 "Manrope",sans-serif;letter-spacing:.37em;margin-top:7px;padding-left:3px}
    .nav {display:flex;align-items:center;gap:36px;font-size:13px;font-weight:600;letter-spacing:.03em}
    .nav a:not(.nav-contact) {transition:opacity .2s}
    .nav a:hover {opacity:.65}
    .nav-contact {border:1px solid rgba(247,243,235,.65);padding:12px 18px;border-radius:30px;transition:background .2s,color .2s}
    .nav-contact:hover {background:var(--paper);color:var(--ink)}
    .lang-switch {border-left:1px solid rgba(247,243,235,.4);padding-left:16px;font-size:12px;letter-spacing:.08em}
    .hero {background:var(--ink);color:var(--paper);position:relative;isolation:isolate;overflow:hidden}
    .hero:after {content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(0deg,rgba(12,27,43,.89) 0%,rgba(12,27,43,.34) 43%,transparent 78%),linear-gradient(180deg,rgba(12,27,43,.38),transparent 28%)}
    .hero-media,.hero-media img,.hero-media video {position:absolute;inset:0;width:100%;height:100%}
    .hero-media {z-index:-2}
    .hero-media img,.hero-media video {object-fit:cover;object-position:center 43%}
    .hero-inner {min-height:clamp(700px,100svh,980px);padding-top:160px;padding-bottom:36px;display:flex;align-items:flex-end;justify-content:space-between;gap:55px}
    .hero-copy {max-width:900px;display:flex;flex-direction:column;align-items:flex-start}
    .eyebrow {font-size:12px;font-weight:700;letter-spacing:.17em;text-transform:uppercase;display:flex;align-items:center;gap:13px}
    .eyebrow:before {content:"";width:22px;height:1px;background:currentColor;opacity:.75}
    h1,h2,h3,p {margin-top:0}
    h1,h2,.serif {font-family:"Playfair Display",Georgia,serif;font-weight:400}
    h1 {font-size:clamp(68px,7vw,106px);letter-spacing:-.06em;line-height:1.01;margin:22px 0 22px;max-width:900px;text-wrap:balance}
    h1 em,h2 em {font-weight:400}
    .hero-description {font-size:17px;line-height:1.55;max-width:590px;color:#f1f0ec;margin-bottom:27px;text-wrap:pretty}
    .text-link {font-size:14px;font-weight:700;letter-spacing:.01em;display:inline-flex;align-items:center;gap:15px;border-bottom:1px solid currentColor;padding-bottom:8px}
    .text-link span:last-child {font-size:20px;font-weight:400;line-height:1;transition:transform .2s}
    .text-link:hover span:last-child {transform:translateX(5px)}
    .hero-credit {max-width:320px;flex:0 0 auto;text-align:right;color:rgba(255,255,255,.85);font-size:10px;line-height:1.65;letter-spacing:.06em;text-transform:uppercase}
    .ticker {border-bottom:1px solid var(--line);background:var(--paper)}
    .ticker-inner {min-height:112px;display:flex;align-items:center;justify-content:space-between;gap:30px}
    .ticker-label {font-size:12px;font-weight:700;letter-spacing:.16em;text-transform:uppercase;white-space:nowrap}
    .ticker-line {height:1px;background:var(--line);flex:1}
    .ticker-words {font-family:"Playfair Display",Georgia,serif;font-size:23px;white-space:nowrap}
    .ticker-words span {color:#8793a2;padding:0 11px}
    .section {padding:130px 0}
    .section-head {display:grid;grid-template-columns:1fr 2.1fr;gap:70px;margin-bottom:76px}
    .section h2 {font-size:clamp(48px,5.6vw,84px);letter-spacing:-.055em;line-height:1.1;margin:0}
    .section-intro {max-width:690px;font-size:18px;line-height:1.6;margin:30px 0 0;color:#455365}
    .services {background:var(--paper)}
    .service-list {border-top:1px solid var(--line)}
    .service {display:grid;grid-template-columns:1fr 2.1fr;gap:70px;padding:38px 0;border-bottom:1px solid var(--line)}
    .service-index {font-size:13px;font-weight:700;letter-spacing:.12em;padding-top:9px}
    .service-content {display:grid;grid-template-columns:1fr 1.13fr;gap:50px;align-items:start}
    .service h3 {font:400 clamp(31px,3.1vw,47px)/1.13 "Playfair Display",Georgia,serif;letter-spacing:-.04em;margin:0}
    .service p {font-size:16px;line-height:1.65;margin:3px 0 0;max-width:420px;color:#485768}
    .projects {background:var(--paper);padding-top:95px}
    .projects-head {display:flex;align-items:end;justify-content:space-between;gap:55px;margin-bottom:48px}
    .projects-head .eyebrow {margin-bottom:20px}
    .projects-head p {font-size:18px;color:#485768;max-width:600px;margin:0}
    .projects-head .text-link {flex:0 0 auto;margin-bottom:9px}
    .project-grid {display:grid;grid-template-columns:1fr 1fr;gap:18px}
    .project-card {position:relative;display:grid;align-items:end;min-height:470px;padding:100px 36px 37px;overflow:hidden;background:var(--ink);color:var(--paper);isolation:isolate}
    .project-card.featured {grid-column:1/-1;min-height:630px}
    .project-card img {position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:transform .6s ease}
    .project-card:hover img {transform:scale(1.035)}
    .project-card:after {content:"";position:absolute;inset:0;z-index:0;background:linear-gradient(0deg,rgba(12,27,43,.8),transparent 58%),linear-gradient(180deg,rgba(12,27,43,.36),transparent 35%)}
    .project-category {position:absolute;top:34px;left:36px;z-index:1;font-size:11px;font-weight:700;letter-spacing:.14em;text-transform:uppercase}
    .project-award {position:absolute;top:25px;right:34px;z-index:1;display:block}
    .project-card .project-award img {position:static;display:block;width:82px;height:82px;object-fit:contain;transition:none;filter:brightness(0) invert(1) drop-shadow(0 2px 4px rgba(0,0,0,.45))}
    .project-card:hover .project-award img {transform:none}
    .project-copy {position:relative;z-index:1;display:flex;flex-direction:column;align-items:flex-start;gap:16px;min-width:0}
    .project-copy strong {font:400 clamp(40px,4.1vw,68px)/1.06 "Playfair Display",Georgia,serif;letter-spacing:-.045em;max-width:700px}
    .project-copy small {white-space:nowrap;font-size:12px;font-weight:700;border-bottom:1px solid currentColor;padding-bottom:5px}
    .project-card.featured .project-copy {text-align:right;align-items:flex-end;max-width:740px;margin-left:auto}
    .project-card.featured .project-copy strong {display:block;font-size:clamp(45px,4.2vw,66px);line-height:1.08}
    .statement {background:var(--blue);color:var(--paper);padding:125px 0 135px;overflow:hidden}
    .statement h2 {font:400 clamp(52px,7vw,104px)/1.12 "Playfair Display",Georgia,serif;letter-spacing:-.05em;max-width:1200px;margin:35px 0 84px;text-wrap:balance}
    .statement h2 em {color:var(--lime);font-weight:400}
    .conviction-bottom {border-top:1px solid rgba(247,243,235,.32);padding-top:42px;display:grid;grid-template-columns:1.25fr .75fr;gap:12%;align-items:start}
    .conviction-bottom p {font-size:19px;line-height:1.62;max-width:650px;margin:0;color:#e4e9e9}
    .conviction-bottom .commitment {font-size:18px}
    .commitment span {display:block;font-size:11px;font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:var(--lime);margin-bottom:20px}
    .contact {background:var(--ink);color:var(--paper);padding:130px 0 80px}
    .contact-grid {display:grid;grid-template-columns:1fr 2fr;gap:70px}
    .contact h2 {font-size:clamp(60px,8vw,120px);line-height:1.03;letter-spacing:-.06em;margin:0 0 52px;display:flex;align-items:center;gap:clamp(8px,1.4vw,20px);flex-wrap:nowrap}
    .contact-phrase {white-space:nowrap}
    .contact-quote {width:clamp(50px,5.5vw,70px);height:clamp(72px,7.8vw,100px);color:var(--lime)}
    .contact-mail {display:inline-flex;gap:16px;align-items:center;font-size:clamp(21px,2.5vw,32px);font-weight:500;line-height:1.3;border-bottom:1px solid currentColor;padding-bottom:8px;word-break:break-word}
    .contact-mail:hover,.contact-phone:hover {color:var(--lime)}
    .contact-phone {display:block;width:max-content;margin-top:18px;font-size:20px;line-height:1.4;border-bottom:1px solid currentColor;padding-bottom:4px}
    .footer {border-top:1px solid rgba(247,243,235,.3);margin-top:125px;padding-top:28px;display:flex;justify-content:space-between;gap:20px;color:#c4ccd3;font-size:12px}
    .portfolio-hero {background:var(--ink);color:var(--paper);padding:225px 0 115px}
    .portfolio-hero h1 {max-width:1000px;margin:30px 0 32px;font-size:clamp(75px,9vw,140px)}
    .portfolio-lead {font-size:19px;line-height:1.6;max-width:620px;margin:0;color:#d8dfe3}
    .portfolio-note {display:grid;grid-template-columns:1fr 2.1fr;gap:70px;padding:35px 0;border-bottom:1px solid var(--line);font-size:15px;color:#485768}
    .portfolio-note strong {color:var(--ink);font-size:12px;letter-spacing:.13em;text-transform:uppercase}
    .works {padding:110px 0 145px}
    .work {display:grid;grid-template-columns:1.2fr 1fr;gap:7%;padding:65px 0;border-bottom:1px solid var(--line);align-items:center}
    .work:first-child {padding-top:0}
    .work:nth-child(even) .work-art {order:2}
    .work-art {min-height:480px;display:flex;flex-direction:column;justify-content:space-between;position:relative;overflow:hidden;padding:34px;isolation:isolate;background:var(--blue);color:var(--paper)}
    .work-video {padding:0;min-height:0;aspect-ratio:16/9;align-self:center;width:100%;background:var(--ink)}
    .work-video:after {display:none}
    .work-video iframe {border:0;width:100%;height:100%;position:absolute;inset:0}
    .work-art:after {content:"";position:absolute;inset:auto -20% -50% 20%;height:90%;border:1px solid rgba(255,255,255,.28);border-radius:50%;transform:rotate(-22deg);z-index:-1}
    .work-art.onella {background:#718498;color:#fff}
    .work-art.onella:after {border-color:rgba(255,255,255,.35);transform:rotate(28deg)}
    .work-art.entrepreneurs {background:#d9e377;color:var(--ink)}
    .work-art.entrepreneurs:after {border-color:rgba(21,38,58,.3);transform:rotate(10deg)}
    .work-art-label {font:700 12px/1.4 "DM Sans",sans-serif;letter-spacing:.13em;text-transform:uppercase}
    .work-art-title {font:400 clamp(48px,5.3vw,83px)/1.03 "Playfair Display",Georgia,serif;letter-spacing:-.06em;max-width:560px}
    .work-art-number {font:500 14px "DM Sans",sans-serif;align-self:flex-end}
    .work-meta {font-size:12px;letter-spacing:.14em;text-transform:uppercase;font-weight:700;margin-bottom:30px}
    .work h2 {font-size:clamp(47px,4.8vw,74px);line-height:1.1;letter-spacing:-.05em;margin:0 0 24px}
    .work-summary {font-size:18px;line-height:1.6;color:#465465;max-width:530px;margin-bottom:32px}
    #onella .work-copy h2 {font-size:clamp(44px,4vw,62px)}
    .work-art-award {position:absolute;top:22px;right:30px;z-index:1}
    .work-art-award img {width:82px;height:82px;display:block;filter:brightness(0) invert(1) drop-shadow(0 2px 4px rgba(0,0,0,.25))}
    .work-award-note {font-size:13px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--blue);margin:0 0 24px}
    .work-credit {font-size:14px;line-height:1.7;max-width:530px;border-top:1px solid var(--line);padding-top:20px;margin:0 0 28px;color:#4b5968}
    .work-credit strong {color:var(--ink)}
    .portfolio-cta {background:var(--blue);color:var(--paper);padding:85px 0}
    .portfolio-cta .container {display:flex;align-items:center;justify-content:space-between;gap:40px}
    .portfolio-cta p {font:400 clamp(38px,4.3vw,60px)/1.15 "Playfair Display",Georgia,serif;letter-spacing:-.04em;max-width:800px;margin:0}
    .portfolio-cta a {white-space:nowrap}
    .portfolio-cta .text-link {gap:6px}
    .cta-quote {width:13px;height:20px}
    .portfolio-cta .text-link span:last-child {margin-left:9px}
    @media (max-width: 1000px) {
      .container {width:min(calc(100% - 48px),var(--max))}
      .nav {gap:20px}
      .hero-inner {min-height:clamp(670px,94svh,900px);padding-bottom:52px}
      h1 {font-size:clamp(65px,8vw,100px)}
      .section-head,.service {grid-template-columns:1fr 2fr;gap:35px}
      .service-content {gap:25px}
      .project-copy {gap:15px}
    }
    @media (max-width: 700px) {
      .container {width:calc(100% - 36px)}
      .header-inner {min-height:83px;gap:12px}
      .brand {gap:9px}.mark {width:41px;height:36px}.brand-name {font-size:21px}.brand-sub {font-size:7px}
      section[id] {scroll-margin-top:83px}
      .nav {gap:0}.nav a:not(.nav-contact) {display:none}.nav-contact {font-size:12px;padding:9px 13px}
      .hero-inner {min-height:max(690px,92svh);padding-top:135px;padding-bottom:28px}
      .hero:after {background:linear-gradient(0deg,rgba(12,27,43,.93) 0%,rgba(12,27,43,.48) 39%,transparent 79%),linear-gradient(180deg,rgba(12,27,43,.42),transparent 25%)}
      h1 {font-size:clamp(48px,11.5vw,76px);margin:19px 0 20px;max-width:620px}
      .hero-description {font-size:16px;max-width:490px;margin-bottom:24px}
      .hero-inner {flex-direction:column;align-items:flex-start;justify-content:flex-end;gap:20px}
      .hero-credit {display:block;max-width:100%;font-size:9px;text-align:left}
      .ticker-inner {display:block;min-height:0;padding:24px 0}.ticker-label {font-size:10px;margin-bottom:9px}.ticker-words {display:block;white-space:normal;font-size:19px;line-height:1.35}.ticker-line {display:none}
      .section {padding:85px 0}
      .section-head,.service,.service-content,.contact-grid {display:block}
      .section-head {margin-bottom:55px}.section h2 {font-size:clamp(48px,10vw,70px);margin-top:25px}
      .section-intro {font-size:17px;margin-top:25px}
      .service {padding:29px 0}.service-index {padding:0;margin-bottom:18px}.service h3 {font-size:36px;margin-bottom:14px}.service p {margin:0}
      .projects-head {display:block;margin-bottom:32px}.projects-head p {font-size:16px}.projects-head .text-link {margin-top:25px}
      .project-grid {display:block}.project-card,.project-card.featured {min-height:390px;margin-bottom:14px;padding:110px 24px 27px}.project-card.featured {min-height:440px}
      .project-card.featured .project-copy {text-align:left;align-items:flex-start;max-width:none;margin-left:0}
      .project-category {top:24px;left:24px;right:24px}
      .project-copy strong,.project-card.featured .project-copy strong {font-size:clamp(38px,8vw,56px);display:block}
      .project-award {top:17px;right:18px}.project-card .project-award img {width:58px;height:58px}.project-card.featured .project-category {right:90px}
      .statement {padding:90px 0}.statement h2 {font-size:clamp(47px,10vw,78px);margin:28px 0 50px}.conviction-bottom {display:block;padding-top:28px}.conviction-bottom p {font-size:17px}.conviction-bottom .commitment {font-size:17px;margin-top:38px}
      .contact {padding:100px 0 45px}.contact h2 {font-size:clamp(40px,11vw,64px);margin:30px 0 45px;gap:8px}.contact-quote {width:clamp(24px,5.5vw,38px);height:clamp(40px,8vw,58px)}.footer {margin-top:100px;flex-wrap:wrap}
      .nav .portfolio-nav {display:inline!important;margin-right:12px;font-size:12px}
      .nav .lang-switch {display:inline!important;margin-left:8px;padding-left:12px;font-size:12px}
      .portfolio-hero {padding:155px 0 75px}.portfolio-hero h1 {font-size:clamp(62px,12vw,90px)}.portfolio-lead {font-size:17px}
      .portfolio-note {display:block;padding:25px 0}.portfolio-note p {margin:12px 0 0}
      .works {padding:65px 0 95px}.work,.work:nth-child(even) {display:flex;flex-direction:column;align-items:stretch;gap:30px;padding:45px 0}.work:first-child {padding-top:0}.work:nth-child(even) .work-art {order:0}
      .work-art {min-height:365px;padding:25px}.work-art-title {font-size:clamp(47px,10vw,70px)}.work-art-award {top:14px;right:20px}.work-art-award img {width:58px;height:58px}.work-art.onella .work-art-label {max-width:calc(100% - 70px)}.work-video {min-height:0;padding:0}
      .work h2 {font-size:clamp(47px,10vw,65px)}#onella .work-copy h2 {font-size:clamp(43px,9vw,58px)}.work-summary {font-size:17px}
      .portfolio-cta {padding:65px 0}.portfolio-cta .container {display:block}.portfolio-cta a {margin-top:30px}
    }
    @media (max-width: 420px) { .header-inner {gap:12px}.nav-contact {display:none} }
    @media (max-width: 375px) { h1 {font-size:45px}.ticker-words {font-size:15px}.contact-mail {font-size:21px}.portfolio-hero h1 {font-size:59px} }
    @media (prefers-reduced-motion:reduce) {html {scroll-behavior:auto} * {transition:none!important}.hero-video {display:none}}