
@import url('https://fonts.googleapis.com/css2?family=Tilt+Warp&family=Figtree:wght@400;500;600;700&display=swap');
.gtr{
  --navy:#071F60;--navy-deep:#041444;--gold:#FFC300;--sun:#FFC82B;--sky:#6EC5EF;
  --c:#00A3E0;--m:#E6007E;--y:#FFE600;--k:#1A1A1A;
  --paper:#F6F7F9;--sheet:#FFFFFF;--ink:#0B1A3F;--muted:#4A5A80;--line:rgba(7,31,96,.12);--cm:rgba(7,31,96,.55);
  --display:"Tilt Warp","Arial Black",system-ui,sans-serif;
  --body:"Figtree",ui-sans-serif,system-ui,-apple-system,"Segoe UI",sans-serif;
  --ease:cubic-bezier(.2,.8,.2,1);
}
.gtr *,.gtr *::before,.gtr *::after{box-sizing:border-box}
.gtr picture{display:contents}
:where(.gtr) picture>img{height:auto}
.gtr{color:var(--ink)!important;font-family:var(--body);font-size:17px;line-height:1.7;-webkit-font-smoothing:antialiased;overflow-x:clip;background:var(--paper)}
.gtr-wrap{max-width:1200px;margin:0 auto;padding-left:max(16px,env(safe-area-inset-left,0px));padding-right:max(16px,env(safe-area-inset-right,0px))}
.gtr h1,.gtr h2,.gtr h3,.gtr h4{font-family:var(--display);font-weight:400;line-height:1.08;text-wrap:balance;margin:0;text-transform:none;color:var(--navy)!important}
.gtr h1{font-size:clamp(42px,6vw,80px);letter-spacing:-.02em}
.gtr h2{font-size:clamp(30px,4vw,50px);letter-spacing:-.01em}
.gtr h3{font-size:clamp(23px,2.4vw,30px)}
.gtr-base h3{font-size:21px}
.gtr h2 strong,.gtr h3 strong{font-weight:400}
.gtr p{margin:0;font-family:var(--body);font-size:17px}
.gtr a{color:var(--navy)!important;text-decoration:none;font-weight:700;background:linear-gradient(var(--c),var(--c)) 0 100%/100% 2px no-repeat;transition:background-size .3s var(--ease),color .2s}
.gtr a:hover{background-size:100% 100%;color:#fff!important}
.gtr a:focus-visible{outline:3px solid var(--m);outline-offset:3px;border-radius:4px}
.gtr ul{margin:0;padding:0;list-style:none}
.gtr li{font-family:var(--body);font-size:17px}
.gtr-band{padding-block:clamp(64px,9vw,112px)}
.gtr-stack{display:grid;gap:18px;align-content:start}

/* crop-marked frames */
.gtr-crop{position:relative;display:block}
.gtr-crop::before{content:"";position:absolute;inset:-22px;pointer-events:none;background:linear-gradient(var(--cm),var(--cm)) 0 18px/12px 1.5px no-repeat,linear-gradient(var(--cm),var(--cm)) 18px 0/1.5px 12px no-repeat,linear-gradient(var(--cm),var(--cm)) 100% 18px/12px 1.5px no-repeat,linear-gradient(var(--cm),var(--cm)) calc(100% - 18px) 0/1.5px 12px no-repeat,linear-gradient(var(--cm),var(--cm)) 0 calc(100% - 18px)/12px 1.5px no-repeat,linear-gradient(var(--cm),var(--cm)) 18px 100%/1.5px 12px no-repeat,linear-gradient(var(--cm),var(--cm)) 100% calc(100% - 18px)/12px 1.5px no-repeat,linear-gradient(var(--cm),var(--cm)) calc(100% - 18px) 100%/1.5px 12px no-repeat;transition:inset .45s var(--ease)}
.gtr-crop:hover::before{inset:-12px}
.gtr-crop img{display:block;width:100%;height:100%;object-fit:cover}
.gtr-reg{position:absolute;width:26px;height:26px;pointer-events:none;color:var(--cm)!important;transition:transform .6s var(--ease)}
.gtr-crop:hover .gtr-reg{transform:rotate(90deg)}

/* CMYK colour bar */
.gtr-bar{display:flex;height:14px;gap:3px}
.gtr-bar i{flex:1;transition:flex-grow .4s var(--ease)}
.gtr-bar i:hover{flex-grow:3}
.gtr-bar i:nth-child(1){background:var(--c)}.gtr-bar i:nth-child(2){background:var(--m)}.gtr-bar i:nth-child(3){background:var(--y)}.gtr-bar i:nth-child(4){background:var(--k)}
.gtr-bar i:nth-child(5){background:color-mix(in srgb,var(--c) 50%,#fff)}.gtr-bar i:nth-child(6){background:color-mix(in srgb,var(--m) 50%,#fff)}.gtr-bar i:nth-child(7){background:color-mix(in srgb,var(--y) 50%,#fff)}.gtr-bar i:nth-child(8){background:color-mix(in srgb,var(--k) 50%,#fff)}
.gtr-bar i:nth-child(9){background:var(--navy)}.gtr-bar i:nth-child(10){background:var(--gold)}

/* buttons */
.gtr-ctas{display:flex;flex-wrap:wrap;gap:12px;margin-top:8px}
.gtr-btn{position:relative;overflow:hidden;display:inline-flex;align-items:center;gap:10px;padding:16px 26px;border-radius:6px;font-family:var(--display);font-weight:400;font-size:17px;line-height:1;border:2px solid var(--navy);color:var(--navy)!important;background:#fff!important;isolation:isolate;transition:transform .3s var(--ease),box-shadow .3s,color .3s}
.gtr-btn::after{content:"";position:absolute;left:0;bottom:0;height:4px;width:100%;z-index:-1;background:linear-gradient(90deg,var(--c) 0 25%,var(--m) 25% 50%,var(--y) 50% 75%,var(--k) 75%);transform:scaleX(0);transform-origin:0 50%;transition:transform .4s var(--ease)}
.gtr-btn:hover{transform:translateY(-3px);box-shadow:6px 6px 0 var(--navy)}
.gtr-btn:hover::after{transform:none}
.gtr-btn.solid{background:var(--navy)!important;color:#fff!important}
.gtr-btn.gold{background:var(--gold)!important;border-color:var(--gold);color:var(--navy)!important}
.gtr-btn.gold:hover{box-shadow:6px 6px 0 var(--navy)}
.gtr-btn svg{width:18px;height:18px;transition:transform .3s var(--ease)}
.gtr-btn:hover svg{transform:translateX(4px)}

/* HERO: proof sheet */
.gtr-hero{padding-block:clamp(56px,7vw,96px)}
.gtr-sheet{position:relative;background:var(--sheet);border-radius:4px;box-shadow:0 1px 0 var(--line),0 40px 80px -50px rgba(7,31,96,.45);padding:clamp(28px,4vw,56px);display:grid;grid-template-columns:1fr 1fr;gap:clamp(32px,5vw,72px);align-items:center}
.gtr-sheet > *{min-width:0}
.gtr-sheet .gtr-bar{position:absolute;left:clamp(28px,4vw,56px);right:clamp(28px,4vw,56px);bottom:0;height:10px}
.gtr-hero-copy{display:grid;gap:18px}
.gtr-hero .gtr-crop{aspect-ratio:4/5}

/* intro two-column */
.gtr-split{display:grid;grid-template-columns:1.1fr .9fr;gap:clamp(32px,5vw,72px);align-items:start}
.gtr-split > *{min-width:0}
.gtr-split .gtr-crop{position:sticky;top:40px}
.gtr-spec{display:grid;border-top:2px solid var(--navy)}
.gtr-spec li{position:relative;padding:14px 8px 14px 44px;border-bottom:1px solid var(--line);transition:background .3s,padding-left .35s var(--ease)}
.gtr-spec li::before{content:"";position:absolute;left:8px;top:17px;width:20px;height:20px;border-radius:50%;background:var(--sw,var(--c));transition:transform .35s var(--ease)}
.gtr-spec li:nth-child(2){--sw:var(--m)}.gtr-spec li:nth-child(3){--sw:var(--y)}.gtr-spec li:nth-child(4){--sw:var(--k)}.gtr-spec li:nth-child(5){--sw:var(--navy)}
.gtr-spec li:hover{background:#fff;padding-left:52px}
.gtr-spec li:hover::before{transform:scale(1.2)}

/* WHERE: swatch chips */
.gtr-sun{background:var(--sun)}
.gtr-chips{display:grid;grid-template-columns:repeat(5,1fr);gap:16px;margin-top:8px}
.gtr-chips li{background:#fff;border-radius:6px;overflow:hidden;display:grid;grid-template-rows:96px auto;box-shadow:0 20px 40px -30px rgba(7,31,96,.6);transition:transform .4s var(--ease),box-shadow .4s}
.gtr-chips li::before{content:"";background:var(--sw,var(--c));transition:transform .5s var(--ease);transform-origin:50% 0}
.gtr-chips li > span{padding:16px 16px 20px;font-size:16px;line-height:1.55}
.gtr-chips li strong{display:block;font-family:var(--display);font-weight:400;font-size:19px;line-height:1.15;color:var(--navy)!important;margin-bottom:6px}
.gtr-chips li:nth-child(2){--sw:var(--m)}.gtr-chips li:nth-child(3){--sw:var(--y)}.gtr-chips li:nth-child(4){--sw:var(--k)}.gtr-chips li:nth-child(5){--sw:var(--navy)}
.gtr-chips li:hover{transform:translateY(-8px) rotate(-1deg);box-shadow:0 30px 50px -28px rgba(7,31,96,.7)}
.gtr-chips li:hover::before{transform:scaleY(1.12)}
.gtr-pair{max-width:980px;display:grid;grid-template-columns:1fr 1fr;gap:clamp(36px,5vw,64px);margin-top:clamp(48px,6vw,72px);padding:22px}
.gtr-pair .gtr-crop{aspect-ratio:4/3}
.gtr-sun .gtr-crop{--cm:rgba(7,31,96,.7)}
.gtr-sun a{background-image:linear-gradient(var(--navy),var(--navy))}

/* BASES: product cards */
.gtr-bases{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;margin-top:28px}
.gtr-base{background:#fff;border:1px solid var(--line);border-radius:6px;padding:22px;display:grid;gap:14px;align-content:start;transition:transform .4s var(--ease),box-shadow .4s,border-color .3s}
.gtr-base .gtr-crop{aspect-ratio:1/1;margin:14px 14px 6px;--cm:rgba(7,31,96,.35)}
.gtr-base .gtr-crop img{object-fit:contain;background:#fff;transition:transform .6s var(--ease)}
.gtr-base:hover{transform:translateY(-6px);box-shadow:0 30px 50px -34px rgba(7,31,96,.6);border-color:transparent}
.gtr-base:hover .gtr-crop img{transform:scale(1.06)}
.gtr-base .gtr-btn{justify-self:start;margin-top:4px}

/* DESIGN & PRINTING: press room */
.gtr-press{background:var(--navy);color:#fff!important;position:relative}
.gtr-press .gtr-bar{position:absolute;left:0;right:0;top:0;height:10px;gap:0}
.gtr-press h2,.gtr-press h3{color:#fff!important}
.gtr-press h2::after{content:"";display:block;width:56px;height:5px;margin-top:16px;background:var(--gold)}
.gtr-press p{color:rgba(255,255,255,.88)!important}
.gtr-press a{color:#fff!important;background-image:linear-gradient(var(--gold),var(--gold))}
.gtr-press a:hover{color:var(--navy)!important}
.gtr-cols{display:grid;grid-template-columns:1fr 1fr;gap:clamp(32px,5vw,72px)}
.gtr-cols > *{min-width:0}
.gtr-plate{border:1px solid rgba(255,255,255,.18);border-radius:6px;padding:clamp(24px,3vw,36px);display:grid;gap:16px;align-content:start;transition:border-color .3s,background .3s}
.gtr-plate:hover{border-color:var(--gold);background:rgba(255,255,255,.04)}

/* ABOUT */
.gtr-about{display:grid;grid-template-columns:1fr 1fr;gap:clamp(32px,5vw,72px)}
.gtr-about > *{min-width:0}
.gtr-about .gtr-stack:last-child{border-left:4px solid var(--gold);padding-left:clamp(20px,3vw,36px)}
.gtr-banner{margin-top:clamp(48px,6vw,72px);padding:22px}
.gtr-banner .gtr-crop img{border-radius:4px}

@media (max-width:1000px){.gtr-chips{grid-template-columns:repeat(2,1fr)}}
@media (max-width:900px){.gtr-sheet,.gtr-split,.gtr-cols,.gtr-about,.gtr-bases{grid-template-columns:1fr}.gtr-split .gtr-crop{position:relative;top:auto}.gtr-hero .gtr-crop{aspect-ratio:4/3}}
@media (max-width:620px){.gtr-chips,.gtr-pair{grid-template-columns:1fr}.gtr-btn{width:100%;justify-content:center}.gtr-crop::before{inset:-12px}}
@media (prefers-reduced-motion:reduce){.gtr *,.gtr *::before,.gtr *::after{transition:none!important}}

.gtr p,.gtr li{color:inherit!important}
.gtr-press p{color:rgba(255,255,255,.88)!important}
.gtr-press h2,.gtr-press h3{color:#fff!important}
.gtr h1,.gtr h2,.gtr h3{margin:0!important}

/* custom cafe barriers (gcb): barrier runs, posts and printed panels */
.gcb-why{display:grid;grid-template-columns:.9fr 1.1fr;gap:clamp(32px,5vw,72px);align-items:start}
.gcb-why > *{min-width:0}
.gcb-why .gtr-crop img{aspect-ratio:1/1}
.gcb-why > .gtr-crop{position:sticky;top:40px}
.gcb-points{display:grid;gap:14px;counter-reset:pt}
.gcb-points li{counter-increment:pt;position:relative;padding:20px 22px 20px 74px;background:#fff;border:1px solid var(--line);border-radius:6px;transition:transform .4s var(--ease),box-shadow .4s}
.gcb-points li::before{content:counter(pt,decimal-leading-zero);position:absolute;left:20px;top:18px;width:38px;height:38px;border-radius:4px;display:grid;place-items:center;font:400 17px/1 var(--display);color:#fff!important;background:var(--sw,var(--c))}
.gcb-points li:nth-child(2){--sw:var(--m)}.gcb-points li:nth-child(3){--sw:var(--navy)}
.gcb-points li:hover{transform:translateX(6px);box-shadow:6px 6px 0 var(--navy)}
.gcb-points strong{color:var(--navy)!important}
/* industries */
.gcb-ind{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-top:28px}
.gcb-ind li{position:relative;padding:26px 24px 24px;background:#fff;border-radius:6px;overflow:hidden;transition:transform .4s var(--ease),box-shadow .4s}
.gcb-ind li::before{content:"";position:absolute;left:0;right:0;top:0;height:8px;background:var(--sw,var(--c));transition:height .4s var(--ease)}
.gcb-ind li:nth-child(2){--sw:var(--m)}.gcb-ind li:nth-child(3){--sw:var(--navy)}.gcb-ind li:nth-child(4){--sw:var(--k)}
.gcb-ind li:hover{transform:translateY(-6px);box-shadow:0 30px 50px -34px rgba(7,31,96,.6)}
.gcb-ind li:hover::before{height:14px}
.gcb-ind strong{font-family:var(--display);font-weight:400;font-size:20px;line-height:1.2;color:var(--navy)!important}
.gcb-ind strong a{color:var(--navy)!important}
/* barrier run */
.gcb-run{position:relative;display:grid;grid-template-columns:18px 1fr 18px;align-items:stretch;padding-bottom:28px}
.gcb-run .post{position:relative;background:linear-gradient(90deg,#9aa3b5,#e8ecf3 45%,#9aa3b5);border-radius:9px 9px 0 0}
.gcb-run .post::after{content:"";position:absolute;left:50%;bottom:-28px;width:80px;height:12px;margin-left:-40px;border-radius:6px;background:#4b5568}
.gcb-run .post::before{content:"";position:absolute;left:50%;top:-12px;width:26px;height:26px;margin-left:-13px;border-radius:50%;background:radial-gradient(circle at 35% 35%,#fff,#9aa3b5 60%)}
.gcb-run .panel{margin:18px 0 34px;position:relative;overflow:hidden;box-shadow:0 30px 60px -40px rgba(7,31,96,.6);transition:transform .5s var(--ease)}
.gcb-run .panel img{display:block;width:100%;aspect-ratio:21/9;object-fit:cover;transition:transform 1.2s var(--ease)}
.gcb-run:hover .panel img{transform:scale(1.04)}
.gcb-run .rail{position:absolute;left:9px;right:9px;top:10px;height:8px;border-radius:8px;background:linear-gradient(#e8ecf3,#9aa3b5)}
.gcb-expert{display:block;padding:22px}
.gcb-expert img{border-radius:6px}
@media (max-width:900px){.gcb-why{grid-template-columns:1fr}.gcb-why > .gtr-crop{position:relative;top:auto}.gcb-ind{grid-template-columns:1fr}}
@media (max-width:620px){.gcb-run .panel img{aspect-ratio:4/3}.gcb-run .post::after{width:44px;margin-left:-22px}}

.gtr .gcb-points li::before{color:#fff!important}
.gtr .gcb-ind strong{color:var(--navy)!important}
