.tgtg-page{background:#ebf5f5;--hf-green:#00615f}
.tgtg-page .case-intro h1{font-size:clamp(48px,7.8vw,150px)}
.tgtg-page .case-intro h1 span{font-family:'Google Sans Flex',Arial,sans-serif}
.tgtg-page .hf-brief h3{color:#00615f}
.tg-panel{width:84.8%;max-width:1900px;margin:0 auto clamp(36px,5.2vw,92px);background:#fff;border-radius:clamp(12px,1.7vw,28px);overflow:hidden}
.tg-panel h2{font-size:clamp(22px,2vw,34px);font-weight:750;line-height:1.3;letter-spacing:-.025em}
.tg-panel figure{margin:0}.tg-panel img{display:block;width:100%;height:auto}
.tg-concept-intro{display:grid;grid-template-columns:32% 1fr;align-items:center;gap:10%;padding:clamp(32px,5.5vw,95px) 9%}
.tg-concept-intro .tg-logo{width:65%;justify-self:center;border-radius:50%}
.tg-concept-intro h2{margin:0 0 22px}.tg-concept-intro p{font-size:clamp(15px,1.25vw,22px);line-height:1.55;margin:0}
.tg-adventures{padding:clamp(40px,8vw,140px) 0 clamp(40px,8vw,140px)}
.tg-adventures>h2,.tg-motion-section>h2{text-align:center;margin:0 6% clamp(35px,7vw,120px)}
.tg-stills{display:grid;grid-template-columns:1fr 1fr;gap:clamp(14px,2vw,36px);width:89%;margin:auto}
.tg-stills .tg-wide{grid-column:1/-1}.tg-stills img{border-radius:clamp(10px,1.2vw,20px)}
.tg-motion-section{margin-top:clamp(64px,9vw,160px);padding-top:clamp(56px,8vw,140px);border-top:1px solid rgb(0 0 0 / 6%)}
.tg-loops{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(16px,3.5vw,60px);width:89%;margin:auto}
.tg-loops video{display:block;width:100%;height:auto;aspect-ratio:9/16;background:#eae5d5;border-radius:clamp(10px,1.2vw,20px)}
.tg-social{padding:clamp(45px,7.5vw,130px) 0}
.tg-social h2,.tg-social h3{text-align:center}.tg-social h2{margin:0 0 55px}.tg-social h3{font-size:clamp(17px,1.5vw,25px);font-weight:350;margin:0 0 35px}
.tg-stories{display:flex;justify-content:center;gap:4%;padding:0 6%;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-color:#00615f #ebf5f5;scrollbar-width:thin}
.tg-story{position:relative;display:block;flex:0 0 30.66%;padding:0;border:0;background:transparent;cursor:pointer;border-radius:14px;overflow:hidden;scroll-snap-align:center}
.tg-story img{width:100%;height:auto;aspect-ratio:9/16;object-fit:contain}
.tg-play{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);display:grid;place-items:center;width:clamp(44px,4.5vw,68px);height:clamp(44px,4.5vw,68px);border-radius:50%;background:#00615fe8;color:#fff;font-size:23px;box-shadow:0 2px 20px #0002;transition:background .2s}
.tg-story:hover .tg-play{background:#003f3d}
.tg-end{padding:clamp(35px,5vw,85px);background:#00615f;color:white;text-align:center}
.tg-end img{width:clamp(65px,9vw,150px);margin:0 auto 28px;border-radius:50%}.tg-end p{font-size:clamp(10px,.9vw,15px);letter-spacing:.12em}.tg-end h2{color:white;margin:20px 0 0}
.tg-motion-enabled .tg-reveal{opacity:0;transform:translateY(40px) scale(.985);transition:opacity .85s ease,transform 1.1s cubic-bezier(.2,.75,.2,1)}
.tg-motion-enabled .tg-reveal.is-visible{opacity:1;transform:none}
.tg-dialog{border:0;background:#111;padding:0;width:auto;max-width:94vw;max-height:94dvh;overflow:visible;border-radius:12px;color:white}
.tg-dialog::backdrop{background:#000c;backdrop-filter:blur(7px)}
.tg-dialog video{display:block;width:auto;max-width:94vw;max-height:88dvh;aspect-ratio:9/16;border-radius:12px}
.tg-close{position:absolute;right:8px;top:8px;z-index:2;width:44px;height:44px;border:1px solid #fff6;border-radius:50%;background:#111d;color:#fff;font-size:30px;line-height:1;cursor:pointer}
@media(max-width:700px){
.tg-panel{width:90%;border-radius:16px;margin-bottom:36px}
.tg-concept-intro{grid-template-columns:24% 1fr;gap:7%;padding:32px 6%}.tg-concept-intro .tg-logo{width:100%}.tg-concept-intro h2{font-size:20px}.tg-concept-intro p{font-size:15px}
.tg-stills{width:88%;gap:12px}.tg-loops{grid-template-columns:repeat(2,minmax(0,1fr));gap:16px;width:88%}
.tg-social h2{margin-bottom:30px}
.tg-stories{justify-content:flex-start;padding:4px 8% 22px;gap:14px;scroll-padding-inline:8%;overscroll-behavior-x:contain}.tg-story{flex-basis:86%;scroll-snap-stop:always}
.tgtg-page .hf-introduction{text-align:left}
}
@media(prefers-reduced-motion:reduce){.tg-motion-enabled .tg-reveal{opacity:1;transform:none;transition:none}}

/* Six stories, with a horizontal progress rail. */
.tg-stories{justify-content:flex-start;scroll-padding-inline:6%;scrollbar-width:none;overscroll-behavior-x:contain}
.tg-stories::-webkit-scrollbar{display:none}
.tg-story-nav{display:flex;width:min(340px,72%);margin:30px auto 0;gap:0}
.tg-story.tg-pointer-return:focus{outline:none!important;box-shadow:none!important}
.tg-dialog{box-sizing:border-box;position:fixed;inset:0;margin:auto;padding:0;width:min(90vw,49.5vh);width:min(90vw,49.5dvh);max-width:none;height:auto;max-height:none;aspect-ratio:9/16;overflow:hidden;border:0;border-radius:12px;background:#111}
.tg-dialog[open]{display:block;animation:tg-dialog-in .22s ease-out}
.tg-dialog video{display:block;width:100%;height:100%;max-width:none;max-height:none;object-fit:contain;aspect-ratio:9/16}
.tgtg-page .tg-dialog,.tgtg-page .tg-dialog *,.tg-dialog::backdrop{cursor:auto!important}
.tgtg-page .tg-dialog .tg-close{cursor:pointer!important}
.tg-modal-open .site-pointer,.tg-modal-open .glass-cursor{visibility:hidden!important}
.tg-buffering{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);padding:10px 16px;background:#111c;border-radius:20px;color:white;font-size:14px;pointer-events:none}
.tg-buffering[hidden]{display:none}
@keyframes tg-dialog-in{from{opacity:0;transform:translateY(10px) scale(.98)}to{opacity:1;transform:none}}
@media(prefers-reduced-motion:reduce){.tg-dialog[open]{animation:none}}

/* Continuous, draggable scrollbar. Native range supports mouse, touch and keys. */
.tg-stories{scroll-snap-type:none}
.tg-story-nav{width:min(560px,72%);margin:28px auto 0}
.tg-story-slider{-webkit-appearance:none;appearance:none;display:block;width:100%;height:36px;padding:0;margin:0;border:0;border-radius:0;background:transparent;touch-action:pan-y;--thumb-width:clamp(48px,8vw,94px)}
.tg-story-slider::-webkit-slider-runnable-track{height:6px;background:#dce9e7;border-radius:8px}
.tg-story-slider::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;width:var(--thumb-width);height:12px;margin-top:-3px;border:0;border-radius:8px;background:#00615f;box-shadow:0 0 0 1px #fff4}
.tg-story-slider::-moz-range-track{height:6px;background:#dce9e7;border-radius:8px}
.tg-story-slider::-moz-range-thumb{width:var(--thumb-width);height:12px;border:0;border-radius:8px;background:#00615f}
.tgtg-page .tg-story-slider{cursor:grab!important}
.tgtg-page .tg-story-slider:active{cursor:grabbing!important}
.tg-story-slider:focus:not(:focus-visible){outline:none!important;box-shadow:none!important}
.tg-story-slider:focus-visible{outline:2px solid #00615f;outline-offset:5px;border-radius:8px}
.tgtg-page:has(.tg-story-slider:hover) .site-pointer,.tgtg-page:has(.tg-story-slider:active) .site-pointer{visibility:hidden!important}

/* Keep the whole portrait and its navigation within a comfortable screen height. */
.tg-social{padding:clamp(28px,4vw,64px) 0}
.tg-social h2{margin-bottom:22px}
.tg-social h3{margin-bottom:24px}
.tg-stories{align-items:flex-start;gap:clamp(16px,2.4vw,40px);overflow-y:hidden;padding-block:6px;}
.tg-stories .tg-story{flex:0 0 auto;width:min(315px,29.25vh,76vw);width:min(315px,29.25svh,76vw);height:auto;aspect-ratio:9/16;min-height:0}
.tg-stories .tg-story img{width:100%;height:100%;object-fit:contain}
.tg-story-nav{margin-top:18px}