/* Kee working base. Reference principles: full-width grid, offset text,
   large type, stacked panels and white cards. Review from Studio upwards. */
@font-face{font-family:Work;src:url('assets/work-sans-400.woff2') format('woff2');font-weight:400;font-display:swap}
@font-face{font-family:Work;src:url('assets/work-sans-500.woff2') format('woff2');font-weight:500;font-display:swap}
@font-face{font-family:Syne;src:url('assets/syne-700.woff2') format('woff2');font-weight:700;font-display:swap}
:root{
  /* Kee colour system — approved 19 September 2026. */
  --kee-black:#111110;
  --kee-charcoal:#363636;
  --kee-grey-mid:#858681;
  --kee-grey-pale:#d8d8d2;
  --kee-stone:#f0edea;
  --kee-warm-white:#fafaf9;
  --kee-white:#ffffff;

  --kee-lime:#cbe65a;
  --kee-cyan:#00b7eb;
  --kee-spring-green:#00a93c;
  --kee-coral:#ff6f61;
  --kee-amber:#ffbf00;

  --kee-navy:#1d2944;
  --kee-denim:#1560bd;
  --kee-dark-green:#177245;

  --kee-guava:#ff3d33;
  --kee-darkwood:#855e42;
  --kee-punch:#ec5578;
  --kee-amethyst:#9966cc;

  /* Current component roles. Reassign these only as blocks are approved. */
  --paper:var(--kee-stone);
  --white:var(--kee-white);
  --ink:var(--kee-black);
  --lime:var(--kee-lime);
  --green:var(--kee-spring-green);
  --lemon:var(--kee-amber);
  --coral:var(--kee-coral);
  --rule:var(--kee-grey-pale);
  --gutter:clamp(22px,4.4vw,84px);
  --gap:clamp(16px,1.7vw,24px);
  --section:clamp(88px,13vw,192px);
  --serif:Georgia,'Times New Roman',serif;
  --ease-standard:cubic-bezier(.2,0,0,1);
  --ease-decelerate:cubic-bezier(.05,.7,.1,1);
  --duration-fast:150ms;
  --duration-line:480ms;
  --duration-cover:560ms;
  --stagger-line:90ms;
}
*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:24px}body{margin:0;background:var(--paper);color:var(--ink);font:400 16px/1.45 Work,Arial,sans-serif;letter-spacing:-.011em;-webkit-font-smoothing:antialiased}h1,h2,h3,p{margin:0}h1,h2,h3{font-weight:500}a{color:inherit;text-decoration:none}img{display:block;max-width:100%;height:auto}button{font:inherit}a:focus-visible{outline:2px solid var(--ink);outline-offset:6px}mark{background:var(--lime);color:inherit;padding:0 .09em .04em;box-decoration-break:clone;-webkit-box-decoration-break:clone}.wrap{padding-inline:var(--gutter)}.section-space{padding-block:var(--section)}.page-grid{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:var(--gap)}.rail{grid-column:1/span 3}.main-column{grid-column:5/-1;min-width:0}.eyebrow{font-size:12px;font-weight:500;line-height:1.4;letter-spacing:.07em;text-transform:uppercase}.motion-line{display:block;overflow:hidden}.motion-line-inner{display:block}.skip{position:fixed;top:12px;left:12px;z-index:100;padding:12px 20px;background:var(--lime);transform:translateY(-160%)}.skip:focus{transform:none}.mobile-break{display:none}
/* Opening: scale and alignment carry the hierarchy. */
.header{margin:0 var(--gutter);min-height:112px;display:flex;align-items:center;gap:48px}.kee-mark{flex:none}.studio-label{font-size:14px;line-height:1.25}.header nav{display:flex;gap:32px;margin-left:auto}.header nav a{padding:12px 0}.header nav a:hover{text-decoration:underline;text-underline-offset:6px}.opening{min-height:calc(100svh - 112px);padding-top:40px;padding-bottom:40px;display:flex;flex-direction:column;justify-content:flex-end}.opening h1{font:700 clamp(64px,10.4vw,176px)/1.01 Syne,Work,sans-serif;letter-spacing:-.055em;margin:40px 0 60px}.opening h1 mark{padding:0 .06em}.opening-bottom{align-items:end;position:relative}.opening-bottom .rail{font-size:14px}.opening-bottom .main-column{grid-column:5/11;font-size:clamp(18px,1.6vw,25px);max-width:36ch}.round-link{grid-column:12;justify-self:end;display:grid;place-items:center;width:52px;height:52px;border:1.5px solid;border-radius:50%;font-size:28px}.round-link:hover{background:var(--lime)}
.channel-band{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--gap);padding-top:80px}.channel-tile{background:var(--white);border-radius:14px;min-height:140px;display:flex;align-items:center;justify-content:center;font-size:clamp(24px,3vw,48px);letter-spacing:-.04em}.editorial-copy{font-size:clamp(25px,3.1vw,48px);line-height:1.25;letter-spacing:-.035em}.editorial-copy p+p{margin-top:32px}.discipline-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:var(--gap);margin-top:80px}.discipline-grid span{display:flex;align-items:flex-end;background:var(--white);border-radius:14px;min-height:176px;padding:28px;font-size:clamp(20px,2.2vw,34px);letter-spacing:-.035em}
/* Full-colour statement replaces the reference's dark manifesto. */
.thinking{background:var(--green);min-height:85svh;display:flex;flex-direction:column;justify-content:space-between;padding-block:48px;gap:72px}.thinking h2{font:700 clamp(40px,6.6vw,112px)/1.1 Syne,Work,sans-serif;letter-spacing:-.055em}.thinking-bottom p{font-size:20px}.work-intro h2{font:700 clamp(40px,5.4vw,88px)/1.04 Syne,Work,sans-serif;letter-spacing:-.055em}.work-intro p{font-size:16px;line-height:1.6;margin-top:32px}
/* The reference's stacking rhythm, filled with existing Kee concept glimpses. */
.work-stack{position:relative;padding-bottom:32px}.work-panel{position:sticky;top:24px;display:grid;grid-template-columns:1fr 1fr;min-height:620px;height:calc(100svh - 72px);max-height:880px;border-radius:20px;overflow:hidden;background:var(--lime);margin-bottom:32px}.work-panel:nth-child(2){top:40px;background:var(--lemon)}.work-panel:nth-child(3){top:56px;background:var(--coral);margin-bottom:0}.panel-copy{display:flex;flex-direction:column;align-items:flex-start;padding:clamp(28px,4vw,64px);gap:28px;min-width:0}.panel-copy h3{font:700 clamp(36px,4.3vw,76px)/1.04 Syne,Work,sans-serif;letter-spacing:-.05em;margin-top:32px}.panel-copy p{font-size:clamp(17px,1.35vw,21px);line-height:1.5;max-width:35ch}.panel-caption{font-size:13px;margin-top:auto}.website-stage{position:relative;overflow:hidden;min-width:0;background:#273b26;color:#fff}.vineyard-image{position:absolute;top:-24px;width:100%;height:calc(100% + 48px);object-fit:cover;object-position:center 60%;will-change:transform}.website-shade{position:absolute;inset:0;background:linear-gradient(#14291644,transparent 38%,#122112b3)}.concept-nav{position:absolute;top:28px;left:32px;right:32px;font:italic 24px var(--serif)}.concept-nav>span:last-child{display:none}.website-message{position:absolute;left:32px;bottom:110px}.website-message p{font:clamp(64px,6vw,105px)/.95 var(--serif);letter-spacing:-.05em;margin-top:20px}.website-bottom{position:absolute;bottom:28px;left:32px;right:32px;display:flex;justify-content:space-between;align-items:center;gap:24px;font-size:14px}.website-bottom>span:first-child{max-width:23ch}.round-arrow{display:grid;place-items:center;width:44px;height:44px;border:1px solid currentColor;border-radius:50%;font-size:25px;flex:none}
.email-stage{position:relative;overflow:hidden;display:flex;justify-content:center;align-items:center;background:#f3efd9;padding:36px 28px;min-width:0}.stage-note{position:absolute;left:20px;bottom:20px;font-size:12px;writing-mode:vertical-rl;transform:rotate(180deg)}.email-artboard{width:82%;max-width:360px;background:#fff9eb;color:#462137;transform:rotate(-4deg)}.serein-name{font:30px var(--serif);text-align:center;letter-spacing:.12em;padding:18px}.email-artboard>img{width:100%;height:185px;object-fit:cover;object-position:60% 60%}.email-body{padding:22px}.email-body .eyebrow{font-size:11px}.email-body>p{font:40px/.96 var(--serif);letter-spacing:-.04em;margin:16px 0 22px}.email-divider{height:1px;background:#d9cbbd;margin-bottom:14px}.email-body>span:not(.eyebrow){font-size:12px;line-height:1.5}.sample-cta{display:flex;justify-content:space-between;border-bottom:1px solid currentColor;padding:20px 0 8px}.social-stage{display:grid;grid-template-rows:56% 44%;background:#f4eddc;color:#462137;min-width:0}.social-photo{position:relative;min-height:0}.social-photo img{width:100%;height:100%;object-fit:cover;object-position:65% 54%}.social-photo>span{position:absolute;left:28px;top:24px;font:32px var(--serif);letter-spacing:.1em}.social-type{padding:32px;position:relative}.social-type>p{font:clamp(32px,3.5vw,54px)/1 var(--serif);letter-spacing:-.04em;margin-top:24px}.social-circle{position:absolute;bottom:24px;right:28px;width:44px;height:44px;display:grid;place-items:center;border:1px solid currentColor;border-radius:50%;font-size:25px}
/* Three white service cards are the next block to review above Studio. */
.services{padding:0 var(--gutter) 96px}.services-intro{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:var(--gap);margin-bottom:48px}.services-intro>.eyebrow{grid-column:1/span 3}.services-intro h2{grid-column:5/-1;font-size:clamp(36px,4.5vw,72px);letter-spacing:-.045em;line-height:1.04}.services-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--gap)}.service-card{background:var(--white);border-radius:20px;padding:clamp(24px,3vw,48px);min-height:480px;display:flex;flex-direction:column;justify-content:space-between;gap:72px;transition:background-color var(--duration-fast) var(--ease-standard)}.service-number{display:grid;place-items:center;width:48px;height:48px;border:1.5px solid;border-radius:50%;font-size:14px}.service-card>div{flex:1;display:flex;flex-direction:column}.service-card h3{font-size:16px;margin-bottom:20px}.service-headline{font-size:clamp(26px,2.6vw,42px);font-weight:500;letter-spacing:-.035em;line-height:1.08;margin-bottom:24px}.service-description{font-size:16px;line-height:1.55;margin-top:auto}.service-card{cursor:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24'%3E%3Ccircle cx='12' cy='12' r='6' fill='%23111110' stroke='white' stroke-width='2'/%3E%3C/svg%3E") 12 12,auto}
@media(hover:hover){.service-web:hover{background:var(--kee-cyan)}.service-email:hover{background:var(--kee-amber)}.service-brand:hover{background:var(--kee-coral)}}
/* Existing Kee Studio close: same content, lime, typography and composition. */
.studio{margin:0 var(--gutter);background:var(--lime);padding:36px 36px 28px;display:grid;grid-template-columns:1.14fr 1fr;gap:26px;position:relative;overflow:hidden}.studio-heading h2{font-size:clamp(40px,4.2vw,62px);letter-spacing:-.055em;font-weight:400;line-height:1.03;margin-top:17px}.studio-heading h2 em{font-family:var(--serif);font-weight:400}.studio-copy{align-self:start;position:relative;z-index:1;padding-top:4px}.studio-copy p{font-size:16px;line-height:1.5;letter-spacing:-.035em;max-width:44ch}.studio-copy>a{display:flex;align-items:center;justify-content:space-between;gap:25px;margin-top:28px;font-size:16px;max-width:350px;border-bottom:1px solid #7d8542;padding-bottom:12px}.studio-copy>a span{font-size:24px;transition:transform var(--duration-fast) var(--ease-standard)}.studio-copy>a:hover span{transform:translate(4px,-4px)}.studio-word-mask{display:block;overflow:hidden;margin-top:60px;grid-column:1/-1;justify-self:end}.studio-word{display:block;font-family:Syne,Work,sans-serif;font-weight:700;font-size:clamp(90px,18vw,290px);letter-spacing:-.075em;line-height:.82}footer{margin:0 var(--gutter);padding:28px 0 32px;display:flex;justify-content:space-between;align-items:center;gap:20px;font-size:13px}footer p{color:#60635a}footer>a:last-child{font-size:16px}footer>a:last-child span{margin-left:28px}
@media(max-width:1024px){.page-grid,.services-intro{grid-template-columns:repeat(8,minmax(0,1fr))}.rail,.services-intro>.eyebrow{grid-column:1/span 2}.main-column,.services-intro h2{grid-column:3/-1}.opening-bottom .main-column{grid-column:3/8}.round-link{grid-column:8}.header{gap:28px}.work-panel{min-height:580px}.panel-copy{padding:28px}.panel-copy h3{font-size:40px}.service-card{padding:24px;gap:56px}.service-headline{font-size:28px}.discipline-grid span{padding:24px;font-size:24px}.social-type{padding:24px}.social-type>p{font-size:36px}}
@media(max-width:760px){:root{--section:80px}.header{min-height:88px;gap:20px}.kee-mark img{width:80px}.studio-label{display:none}.header nav{gap:18px;font-size:14px}.opening{min-height:calc(80svh - 88px);padding-top:36px;padding-bottom:32px}.opening>.eyebrow{max-width:28ch}.opening h1{font-size:clamp(43px,9.7vw,76px);margin:40px 0 48px}.page-grid,.services-intro{grid-template-columns:repeat(4,minmax(0,1fr));row-gap:28px}.rail,.main-column,.services-intro>.eyebrow,.services-intro h2{grid-column:1/-1}.opening-bottom .rail{display:none}.opening-bottom .main-column{grid-column:1/4;font-size:17px}.round-link{grid-column:4;width:44px;height:44px}.channel-band{gap:12px;padding-top:40px}.channel-tile{min-height:92px;font-size:clamp(17px,4vw,26px);border-radius:10px}.editorial-copy{font-size:28px}.discipline-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:16px;margin-top:48px}.discipline-grid span{min-height:120px;padding:20px;font-size:25px}.thinking{min-height:560px;padding-block:32px;gap:56px}.thinking h2{font-size:clamp(28px,6.3vw,49px);line-height:1.2}.thinking-bottom p{font-size:18px}.work-intro h2{font-size:clamp(35px,7vw,54px)}.work-intro p{margin-top:24px}.work-panel{position:relative;top:auto!important;height:auto;max-height:none;min-height:0;grid-template-columns:1fr;margin-bottom:24px;border-radius:16px}.panel-copy{padding:28px;gap:24px}.panel-copy h3{margin:0;font-size:clamp(32px,6vw,44px)}.panel-copy h3 br{display:none}.panel-copy p{font-size:16px;max-width:40ch}.panel-caption{margin-top:8px;font-size:12px}.website-stage{min-height:500px}.website-message{left:24px}.website-message p{font-size:68px}.website-bottom{left:24px;right:24px;font-size:13px}.concept-nav{left:24px}.email-stage{min-height:570px;padding:36px 24px}.email-artboard{width:84%}.social-stage{height:570px}.social-type>p{font-size:38px}.services{padding-bottom:64px}.services-intro{margin-bottom:32px}.services-intro h2{font-size:40px}.services-grid{grid-template-columns:1fr;gap:20px}.service-card{min-height:380px;padding:28px;gap:48px}.service-headline{font-size:34px;max-width:16ch}.service-description{max-width:40ch}.studio{padding:25px;display:block}.studio-heading h2{font-size:43px;line-height:1.03}.studio-copy{padding-top:25px}.studio-copy p{font-size:16px;line-height:1.45}.studio-copy>a{margin-top:23px;font-size:16px}.studio-word-mask{margin-top:48px}.studio-word{display:block;text-align:right;font-size:clamp(76px,20vw,145px)}footer{padding:25px 0;flex-wrap:wrap}footer p{font-size:12px;order:3;width:100%}footer>a:last-child{margin-left:auto;font-size:14px}}
@media(max-width:360px){.header nav{gap:12px;font-size:13px}.kee-mark img{width:70px}.service-headline{font-size:30px}.services-intro h2{font-size:36px}.studio-heading h2{font-size:37px}.email-artboard{width:94%}.social-type>p{font-size:32px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*:before,*:after{animation:none!important;transition:none!important}.vineyard-image,.motion-line-inner,.studio-word{transform:none!important}.studio{clip-path:none!important}.work-panel{position:relative;top:auto!important}}
html[data-motion=reduce]{scroll-behavior:auto}html[data-motion=reduce] *{animation:none!important;transition:none!important}html[data-motion=reduce] .vineyard-image,html[data-motion=reduce] .motion-line-inner,html[data-motion=reduce] .studio-word{transform:none!important}html[data-motion=reduce] .studio{clip-path:none!important}html[data-motion=reduce] .work-panel{position:relative;top:auto!important}