/* GrowBahrain Studio — white, editorial, connected. Shared across the whole site. */
:root{--paper:#fff;--wash:#f4f7f5;--line:#dce5df;--ink:#102033;--muted:#596a72;--green:#17af79;--gold:#fcc04e;--ease:cubic-bezier(.22,.68,0,1)}
body,body.page-index{background:#fff;--paper:#fff;--wash:#f4f7f5;--line:#dce5df}
.container{width:min(1240px,calc(100% - 64px));max-width:1240px}
.site-header,.page-index .site-header{background:rgba(255,255,255,.98);border-bottom:1px solid #e8eeea}
.nav-inner{min-height:90px}.brand-logo{width:190px;height:auto}.site-header .button{padding:13px 22px}
.section{padding:104px 0}.page-hero{padding:82px 0 88px}.home-hero{padding:80px 0 88px}
h1,h2,h3{font-feature-settings:'ss01';text-wrap:balance}h1{letter-spacing:-.052em!important}h2{letter-spacing:-.04em}
p{ text-wrap:pretty } .lead,.hero-description{line-height:1.75}
.eyebrow{font-size:.7rem!important;font-weight:700;letter-spacing:.15em;line-height:1.7;color:#187353;margin-bottom:22px}
.section-head{max-width:810px;margin-bottom:46px}.section-head h2{font-size:clamp(2rem,3.5vw,3.1rem);line-height:1.12}
.section-head .lead{font-size:1.05rem;max-width:650px;margin-top:22px}
.studio-hero-grid{display:grid;grid-template-columns:minmax(0,1.08fr) minmax(0,.92fr);align-items:center;gap:60px}
.studio-hero-grid h1,.gb-hero-grid h1{font-size:clamp(2.35rem,4.2vw,3.8rem);line-height:1.09}
.studio-hero-grid .hero-description{font-size:1.03rem;margin-top:24px;max-width:610px}
.studio-hero-grid .button-row{margin-top:28px}.studio-hero-grid .hero-note{font-size:.9rem}
.studio-visual{position:relative;isolation:isolate;min-width:0;align-self:center;border-radius:28px;box-shadow:0 26px 56px -32px #10203355}
.studio-visual svg{display:block;width:100%;height:auto;border-radius:28px}
.studio-visual::after{content:'';position:absolute;inset:13px;border:1px solid #ffffff0d;border-radius:18px;pointer-events:none}
.gb-hero-grid{gap:60px}.gb-hero-grid>img{background:#f6f8f5!important;border:1px solid #e2eae4;max-height:540px;object-fit:contain}
.hero-grid{gap:60px;grid-template-columns:minmax(0,1.08fr) minmax(0,.92fr)}
.hero-copy h1{font-size:clamp(3.05rem,4.9vw,4.5rem);line-height:1.1}.hero-copy .hero-description{font-size:1.05rem;line-height:1.75}
.workflow-visual{min-height:0;padding:25px 26px 0;border-radius:26px;box-shadow:0 30px 50px -36px #10203390}.workflow-visual .connected-art{margin:0 0 14px}.workflow-tabs button{font-size:.74rem;padding:10px 9px}.journey-panel{min-height:218px}.journey-panel h2{font-size:2rem}.journey-panel p{font-size:.83rem}
.feature-card,.door,.poster,.plan,.product-card{border-radius:18px;border-color:#dce5df;box-shadow:none}
.feature-card{padding:30px}.feature-card h3{line-height:1.18;letter-spacing:-.035em}.feature-card p{line-height:1.7}
.page-index #how-we-help,.page-index #why,.page-index .tint-section{background:#fff}
.page-index #how-we-help{border-block:1px solid #e8eeea}.page-index #why{border-top:1px solid #e8eeea}
.two-grid,.three-grid{gap:24px}.page-index .service-motion{padding:28px!important;background:#fff;border-color:#dce5df}
.page-index .service-motion .step-number{position:static;display:inline-block!important;font-size:.75rem;color:#187353;margin:0!important;border:1px solid #dce5df;padding:6px 10px;border-radius:30px}
.service-art{margin:20px 0 22px;border:0;background:#f4f8f5;border-radius:12px}.service-art svg{height:170px;max-height:170px}.service-motion h3{font-size:1.75rem}
.page-index #why .why-motion{border:0;border-top:1px solid #dce5df;border-radius:0;padding:25px 8px 22px;background:#fff}.why-art{height:83px;margin-bottom:16px}.why-art svg{height:83px;width:104px}.why-accent{display:none}.page-index #why .why-motion h3{font-size:1.4rem}
.page-index .home-poster{border-radius:18px}.page-index .poster-website{background:#f4f8f5}.home-poster .poster-copy{padding:10px 26px 64px}.home-poster .poster-artwork{margin:12px 16px 0}.page-index .home-poster h3{font-size:1.7rem}
.button{border-radius:8px;min-height:46px;transition:transform .25s var(--ease)!important}.button.primary{background:#102033;color:#fff}.button span{transition:transform .25s var(--ease)}.button:hover span{transform:translate(3px,-3px)}.button:focus-visible,a:focus-visible,button:focus-visible,input:focus-visible,textarea:focus-visible,select:focus-visible{outline:3px solid #deaa37;outline-offset:4px}
.dark-section{background:#102033}.dark-section .eyebrow{color:#4bd4a2}.dark-section h2{max-width:790px}.dark-section p{line-height:1.75}
.cta-panel{border-radius:24px}.site-footer{border-top:1px solid #263a43}.site-footer p{font-size:.92rem}
.price-table{display:table;table-layout:fixed}.price-table td,.price-table th{overflow-wrap:anywhere}.product-identity{min-width:0}.product-card{overflow:hidden}
img,svg{max-width:100%}.gb-hero-grid>*{min-width:0}.mega{max-height:calc(100dvh - 125px);overflow:auto}.mega a{opacity:1;transform:none}
/* Visible by default. Entrance is enhancement, never a condition of access. */
.gb-stagger>*,.gb-hero-visual img,.ph,.art1 .mini i,.art3 .grid i,.art4 .blk,.gb-record,.feed-card,.art3 .cart b{opacity:1!important}
.gb-stagger>*,.gb-hero-visual img,.ph,.art1 .mini i,.art4 .blk{transform:none!important}
.art2 .pg{opacity:1!important;transform:translateX(-50%) rotate(var(--r,0deg))!important}.art3 .grid i{transform:none!important}
.motion-ready .reveal{opacity:1!important;transform:none!important;transition:none!important}.hero-copy,.workflow-visual{animation:none!important}.highlight:after{transform:scaleX(1);animation:none}
#gb-footer-logo #seed{opacity:1;transform:none}.gb-link{stroke-dashoffset:0;animation:none!important}.gb-coupon{animation:none!important;display:none}.ind-bg i{animation:none}.phone,.ph.wa{animation:none!important}.gb-hero-visual img.gb-float{animation:none!important}
.screen:not(:has(.scene.on)) .scene:first-child{opacity:1;transform:none}.motion-paused .gb-seed{opacity:0!important}
@keyframes studio-rise{from{transform:translateY(18px)}to{transform:translateY(0)}}
@keyframes studio-hover{0%,100%{transform:translateY(0)}50%{transform:translateY(-7px)}}
@keyframes studio-bob{0%,100%{transform:translateY(0)}50%{transform:translateY(7px)}}
@media(prefers-reduced-motion:no-preference){
.studio-enter{animation:studio-rise .75s var(--ease) both!important}
.studio-visual.in-view .studio-float{animation:studio-hover 7s ease-in-out infinite}
.studio-visual.in-view .studio-bob{animation:studio-bob 7s ease-in-out infinite}
}
@media(hover:hover) and (prefers-reduced-motion:no-preference){.door:hover,.poster:hover{transform:translateY(-4px);box-shadow:none}.button:hover{transform:translateY(-2px)}}
@media(min-width:951px){.has-mega:focus-within .mega{opacity:1;pointer-events:auto;transform:translateX(-50%)}.has-mega:focus-within .mega-group a{opacity:1;transform:none}}
@media(max-width:1100px){.hero-grid,.studio-hero-grid,.gb-hero-grid{gap:32px}.nav-inner{gap:18px}.brand-logo{width:158px}.site-header .button{padding:12px 16px}}
@media(max-width:950px){.container{width:calc(100% - 40px)}.section{padding:72px 0}.page-hero,.home-hero{padding:54px 0 64px}.studio-hero-grid,.hero-grid,.gb-hero-grid{grid-template-columns:1fr;gap:38px}.studio-visual{width:100%;max-width:570px;margin:auto}.hero-copy h1{font-size:clamp(2.85rem,7.5vw,4.4rem)}.hero-copy .hero-description{max-width:600px}.nav-inner{min-height:77px}.brand-logo{width:160px}#main-nav{max-height:calc(100dvh - 90px);overflow:auto;overscroll-behavior:contain;background:#fff}.three-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.home-poster:last-child{grid-column:auto}.mega{max-height:none}.gb-hero-grid>img{max-height:520px}.phone{animation:none!important}}
@media(max-width:600px){.container{width:calc(100% - 36px)}.section{padding:58px 0}.page-hero,.home-hero{padding:42px 0 54px}.section-head{margin-bottom:30px}.section-head h2{font-size:2rem}.hero-copy h1{font-size:2.72rem}.studio-hero-grid h1,.gb-hero-grid h1{font-size:2.5rem}.hero-description{font-size:1rem!important}.two-grid,.three-grid{grid-template-columns:1fr;gap:18px}.button-row{gap:12px;flex-wrap:wrap}.button{font-size:.85rem;padding:13px 17px;white-space:normal;text-align:center}.workflow-visual{padding:22px 19px 0}.journey-panel{min-height:220px}.service-art svg{height:160px}.feature-card{padding:24px}.page-index #why .why-motion{padding:22px 0}.studio-visual{border-radius:22px}.studio-visual svg{border-radius:22px}.studio-visual.in-view *{animation:none!important}.gb-seed{display:none}.gb-seed-origin.is-away{opacity:1}.footer-bottom{line-height:1.8}.price-table th,.price-table td{padding:12px 5px;font-size:.77rem}.phone{max-width:100%}.scene{transition:none}.whatsapp-float{max-width:calc(100vw - 32px)}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto!important}*,*::before,*::after{animation:none!important;transition:none!important}.gb-seed{display:none!important}.gb-seed-origin{opacity:1!important}.studio-enter{transform:none!important}}
html.motion-paused *,html.motion-paused *::before,html.motion-paused *::after{animation:none!important;transition:none!important}
/* No-script menu fallback follows content flow; no hidden navigation or diagrams. */
html.studio-nojs #main-nav{display:flex;position:static;max-height:none;flex-wrap:wrap}
html.studio-nojs .menu-toggle{display:none}
html.studio-nojs .nav-inner{flex-wrap:wrap;padding-block:18px}
html.studio-nojs .has-mega:hover .mega,html.studio-nojs .has-mega:focus-within .mega{display:block;opacity:1;pointer-events:auto}
html.studio-nojs .steps-line::after{transform:none}html.studio-nojs .scene:first-child{opacity:1;transform:none}

@media(prefers-reduced-motion:no-preference) and (min-width:951px){.gb-hero-grid>img.in-view{animation:studio-hover 8s ease-in-out infinite}}