/* ==========================================================================
   GPS FIELD AREA MEASUREMENT — app landing page + legal pages (scoped .gf-page)
   "Field survey" identity taken from the app: night-forest greens and the app's
   emerald buttons, topographic contour lines and a dashed field boundary, with
   airy light sections that match the app's own pale-mint UI. Same layout system
   as the Live Earth Map page. Note: the theme's root font-size is 20px.
   ========================================================================== */
.gf-page {
    --gf-night: #03130e;
    --gf-night-2: #072a1f;
    --gf-green: #10a36f;
    --gf-green-2: #0b7d5b;
    --gf-leaf: #34d399;
    --gf-lime: #bef264;
    --gf-sun: #fbbf24;
    --gf-ink: #0b2a20;
    --gf-muted: #53655d;
    --gf-line: rgba(11, 42, 32, .08);
    --gf-soft: #f1f8f4;
    --gf-grad: linear-gradient(100deg, #0b8a63 0%, #10a36f 50%, #2fc287 100%);
    --gf-grad-text-dark: linear-gradient(100deg, #6ee7b7 0%, #bef264 100%);
    --gf-grad-text-light: linear-gradient(100deg, #0b7d5b 0%, #15a34a 100%);
    color: var(--gf-muted);
    overflow-x: clip;
}
.gf-page section { position: relative; }

/* --- header on the dark hero (same approach as the Live Earth Map page) --- */
.gf-header-bg { background: transparent !important; position: relative; z-index: 4; }
.gf-header-bg .navbar .nav-link { color: rgba(255, 255, 255, .84) !important; }
.gf-header-bg .navbar .nav-link:hover { color: #fff !important; }
.gf-header-bg .navbar .social-muted a, .gf-header-bg .navbar .tk-social a { color: rgba(255, 255, 255, .72) !important; }
.gf-header-bg .navbar .hamburger span,
.gf-header-bg .navbar .hamburger span:before,
.gf-header-bg .navbar .hamburger span:after { background: #fff !important; }
.tk-logo-dark { display: none; }
.tk-logo-light { display: inline-block; }
.navbar-clone .tk-logo-dark { display: none; }
.navbar-clone .tk-logo-light { display: inline-block; }
.navbar-clone.navbar-stick {
    background: rgba(3, 19, 14, .9) !important;
    -webkit-backdrop-filter: blur(12px); backdrop-filter: blur(12px);
    box-shadow: 0 .5rem 1.5rem rgba(0, 0, 0, .4) !important;
}
.navbar-clone .nav-link { color: rgba(255, 255, 255, .84) !important; }
.navbar-clone .nav-link:hover { color: #fff !important; }
.navbar-clone .social-muted a, .navbar-clone .tk-social a { color: rgba(255, 255, 255, .72) !important; }
.navbar-clone .hamburger span,
.navbar-clone .hamburger span:before,
.navbar-clone .hamburger span:after { background: #fff !important; }

/* --- topographic contour lines (pure CSS) --- */
.gf-topo {
    position: absolute; inset: 0; pointer-events: none; z-index: 0;
    background-image:
        repeating-radial-gradient(ellipse 130% 90% at 84% 38%, transparent 0 46px, rgba(134, 239, 172, .075) 47px 48px),
        repeating-radial-gradient(ellipse 110% 80% at 4% 108%, transparent 0 38px, rgba(134, 239, 172, .055) 39px 40px);
    -webkit-mask-image: radial-gradient(120% 90% at 60% 40%, #000 30%, transparent 85%);
    mask-image: radial-gradient(120% 90% at 60% 40%, #000 30%, transparent 85%);
}

/* --- shared type & chips --- */
.gf-kicker {
    display: inline-flex; align-items: center; gap: .45rem;
    font-size: .66rem; font-weight: 700; letter-spacing: .07em; text-transform: uppercase;
    color: var(--gf-green-2); background: rgba(16, 163, 111, .08); border: 1px solid rgba(16, 163, 111, .24);
    padding: .42rem .9rem; border-radius: 2rem;
}
.gf-kicker i { font-size: .9rem; }
.gf-kicker.on-dark { color: #c8f5df; background: rgba(255, 255, 255, .06); border-color: rgba(134, 239, 172, .28); }
.gf-page .gf-h2 {
    margin: 1rem 0 0; color: var(--gf-ink);
    font-weight: 800; letter-spacing: -.03em; line-height: 1.12;
    font-size: clamp(1.6rem, 3vw, 2.4rem); text-wrap: balance;
}
.gf-grad, .gf-grad-dark { -webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent; color: transparent; }
.gf-grad { background-image: var(--gf-grad-text-dark); }
.gf-grad-dark { background-image: var(--gf-grad-text-light); }
.gf-lead { margin: .9rem 0 0; font-size: .86rem; line-height: 1.75; color: var(--gf-muted); text-wrap: pretty; }
.gf-lead.on-dark { color: #a7c4b7; }
.gf-lead a { color: var(--gf-green-2); font-weight: 600; }
.gf-head { max-width: 40rem; margin: 0 auto 2.4rem; text-align: center; }
.gf-section { padding: 4.5rem 0; }

/* --- phone mockups --- */
.gf-phone { display: block; height: auto; filter: drop-shadow(0 1.6rem 2.2rem rgba(2, 20, 14, .35)); }

/* --- store badges --- */
.gf-stores { display: flex; flex-wrap: wrap; gap: .6rem; }
.gf-store {
    display: inline-flex; align-items: center; gap: .6rem;
    padding: .55rem 1.05rem .55rem .85rem; border-radius: .8rem;
    color: #fff; background: #000; border: 1px solid rgba(255, 255, 255, .22); text-decoration: none;
    transition: transform .25s ease, box-shadow .25s ease;
}
.gf-store svg { width: 1.3rem; height: 1.3rem; flex: none; }
.gf-store span { display: flex; flex-direction: column; line-height: 1.1; }
.gf-store small { font-size: .5rem; letter-spacing: .04em; opacity: .8; }
.gf-store b { font-size: .86rem; font-weight: 700; letter-spacing: -.01em; }
a.gf-store:hover { color: #fff; transform: translateY(-2px); box-shadow: 0 .8rem 1.6rem -.6rem rgba(16, 163, 111, .65); }
.gf-store.is-soon { cursor: default; background: rgba(0, 0, 0, .55); }

/* ==========================================================================
   HERO
   ========================================================================== */
.gf-hero {
    margin-top: -120px; padding: calc(120px + 2.5rem) 0 0;
    color: #cde3d8; overflow: hidden; isolation: isolate;
    background:
        radial-gradient(60% 70% at 78% 45%, rgba(16, 163, 111, .34) 0%, transparent 65%),
        radial-gradient(40% 50% at 10% 90%, rgba(190, 242, 100, .1) 0%, transparent 65%),
        linear-gradient(180deg, #020f0b 0%, #05201a 70%, #072a1f 100%);
}
.gf-hero-grid { position: relative; z-index: 1; display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); align-items: center; gap: 2rem; }
.gf-hero-app { display: flex; align-items: center; gap: .9rem; }
.gf-hero-app img { width: 3.2rem; height: 3.2rem; border-radius: .85rem; box-shadow: 0 .8rem 1.8rem -.4rem rgba(16, 163, 111, .6), 0 0 0 1px rgba(255, 255, 255, .12); }
.gf-pill {
    display: inline-flex; align-items: center; gap: .45rem; padding: .38rem .8rem; border-radius: 2rem;
    font-size: .64rem; font-weight: 700; letter-spacing: .03em; color: #e2f6ec;
    background: rgba(255, 255, 255, .07); border: 1px solid rgba(134, 239, 172, .3);
}
.gf-pill .dot { width: .45rem; height: .45rem; border-radius: 50%; background: var(--gf-sun); box-shadow: 0 0 .6rem var(--gf-sun); }
.gf-page .gf-hero-title {
    margin: 1.2rem 0 0; color: #fff;
    font-weight: 800; letter-spacing: -.035em; line-height: 1.02;
    font-size: clamp(2.2rem, 5vw, 3.9rem);
}
.gf-hero-title .gf-grad { display: inline-block; }
.gf-hero-lead { margin: 1.1rem 0 1.6rem; max-width: 30rem; font-size: .92rem; line-height: 1.75; color: #a9c5b8; }
.gf-hero-more { display: inline-flex; align-items: center; gap: .35rem; margin-top: 1.2rem; font-size: .74rem; font-weight: 600; color: #9be8c4; text-decoration: none; }
.gf-hero-more:hover { color: #fff; }
.gf-hero-more i { transition: transform .25s ease; }
.gf-hero-more:hover i { transform: translateY(3px); }

.gf-hero-visual { position: relative; aspect-ratio: 1 / 1; max-width: 34rem; width: 100%; justify-self: center; }
/* the field boundary being measured behind the phones */
.gf-plot { position: absolute; left: 2%; top: 8%; width: 96%; height: 84%; overflow: visible; }
.gf-plot polygon {
    fill: rgba(52, 211, 153, .07); stroke: rgba(134, 239, 172, .55); stroke-width: 1.5; stroke-dasharray: 7 6;
    stroke-linejoin: round; vector-effect: non-scaling-stroke; animation: gfMarch 2.4s linear infinite;
}
.gf-plot circle { fill: var(--gf-leaf); stroke: #fff; stroke-width: 2; vector-effect: non-scaling-stroke; }
@keyframes gfMarch { to { stroke-dashoffset: -26; } }
.gf-glow { position: absolute; left: 50%; top: 50%; width: 70%; height: 70%; transform: translate(-50%, -50%); border-radius: 50%; background: radial-gradient(circle, rgba(16, 163, 111, .45) 0%, transparent 65%); filter: blur(20px); }
.gf-hero-visual .gf-phone { position: absolute; }
.gf-hero-visual .p-center { width: 41%; left: 29.5%; top: 2%; z-index: 3; animation: gfFloat 7s ease-in-out infinite; filter: drop-shadow(0 2rem 2.6rem rgba(0, 0, 0, .55)); }
.gf-hero-visual .p-left { width: 33%; left: 4%; top: 14%; z-index: 2; transform: rotate(-9deg); opacity: .95; animation: gfFloat 8s ease-in-out -2s infinite; }
.gf-hero-visual .p-right { width: 33%; right: 4%; top: 14%; z-index: 2; transform: rotate(9deg); opacity: .95; animation: gfFloat 9s ease-in-out -4s infinite; }
@keyframes gfFloat { 0%, 100% { translate: 0 0; } 50% { translate: 0 -.6rem; } }
.gf-float {
    position: absolute; z-index: 4; display: inline-flex; align-items: center; gap: .4rem; white-space: nowrap;
    padding: .45rem .75rem; border-radius: .75rem;
    font-size: .6rem; font-weight: 700; color: #eafaf2;
    background: rgba(5, 32, 24, .74); border: 1px solid rgba(134, 239, 172, .28);
    -webkit-backdrop-filter: blur(10px); backdrop-filter: blur(10px);
    box-shadow: 0 1rem 2rem -1rem rgba(0, 0, 0, .7);
}
.gf-float i { font-size: .8rem; color: var(--gf-leaf); }
.gf-float .tag { padding: .12rem .35rem; border-radius: .3rem; font-size: .5rem; letter-spacing: .04em; color: #fff; background: var(--gf-green); }
.gf-float.f1 { left: -2%; top: 58%; animation: gfFloat 6s ease-in-out -1s infinite; }
.gf-float.f2 { right: -3%; top: 8%; animation: gfFloat 7s ease-in-out -3s infinite; }
.gf-float.f3 { right: 2%; bottom: 10%; animation: gfFloat 8s ease-in-out -5s infinite; }

.gf-ticker {
    position: relative; z-index: 1; margin-top: 3rem; padding: .9rem 0; overflow: hidden;
    border-top: 1px solid rgba(134, 239, 172, .14); background: rgba(2, 15, 11, .5);
    -webkit-mask-image: linear-gradient(90deg, transparent, #000 8%, #000 92%, transparent);
    mask-image: linear-gradient(90deg, transparent, #000 8%, #000 92%, transparent);
}
.gf-ticker-track { display: flex; gap: 2rem; width: max-content; animation: gfTicker 60s linear infinite; }
.gf-ticker span { display: inline-flex; align-items: center; gap: .4rem; font-size: .7rem; font-weight: 600; color: #9dbfb0; white-space: nowrap; }
.gf-ticker i { font-size: .9rem; color: var(--gf-leaf); }
@keyframes gfTicker { to { transform: translateX(-50%); } }

/* ==========================================================================
   HIGHLIGHTS
   ========================================================================== */
.gf-highlights { background: #fff; }
.gf-stats { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 1rem; }
.gf-stats li {
    display: flex; flex-direction: column; align-items: center; text-align: center; gap: .5rem;
    padding: 1.3rem 1rem; border-radius: 1.2rem;
    background: var(--gf-soft); border: 1px solid var(--gf-line);
}
.gf-stats .n {
    display: grid; place-items: center; min-height: 2.6rem;
    font-size: 2.2rem; font-weight: 800; line-height: 1; letter-spacing: -.03em;
    background: var(--gf-grad-text-light); -webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent; color: transparent;
}
.gf-stats .n i { font-size: 2rem; }
.gf-stats .l { font-size: .72rem; font-weight: 600; line-height: 1.4; color: var(--gf-ink); }

/* ==========================================================================
   SPOTLIGHTS
   ========================================================================== */
.gf-spot { background: #fff; }
.gf-spot--tint { background: linear-gradient(180deg, var(--gf-soft) 0%, #fff 100%); }
.gf-spot--dark {
    overflow: hidden; isolation: isolate; color: #a7c4b7;
    background:
        radial-gradient(55% 70% at 25% 50%, rgba(190, 242, 100, .1) 0%, transparent 60%),
        radial-gradient(50% 60% at 80% 30%, rgba(16, 163, 111, .26) 0%, transparent 65%),
        linear-gradient(180deg, #041a13 0%, #072a1f 100%);
}
.gf-spot--dark .gf-h2 { color: #fff; }
.gf-spot--dark .gf-lead { color: #a7c4b7; }
.gf-spot-grid { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); align-items: center; gap: 3.5rem; }
.gf-spot-grid--rev .gf-spot-media { order: 2; }
.gf-spot-media { position: relative; aspect-ratio: 1 / 1; max-width: 30rem; width: 100%; justify-self: center; }
.gf-spot-media::before {
    content: ""; position: absolute; left: 50%; top: 50%; width: 88%; height: 88%; transform: translate(-50%, -50%);
    border-radius: 50%; background: radial-gradient(circle, rgba(16, 163, 111, .16) 0%, transparent 68%);
}
.gf-spot--dark .gf-spot-media::before { background: radial-gradient(circle, rgba(190, 242, 100, .16) 0%, transparent 68%); }
.gf-spot-media .gf-phone { position: absolute; }
.gf-spot-media .s-back { width: 42%; left: 12%; top: 8%; transform: rotate(-6deg); }
.gf-spot-media .s-front { width: 44%; right: 12%; top: 2%; z-index: 2; }
.gf-checks { list-style: none; margin: 1.3rem 0 0; padding: 0; display: grid; gap: .6rem; }
.gf-checks li { position: relative; padding-left: 1.7rem; font-size: .8rem; line-height: 1.55; }
/* one circle with the tick drawn as a centred SVG, vertically centred on the first line */
.gf-checks li::before {
    content: ""; position: absolute; left: 0; top: calc((1.55em - 1.1rem) / 2); width: 1.1rem; height: 1.1rem; border-radius: 50%;
    background:
        url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M4.2 8.3l2.4 2.4 5.2-5.2' fill='none' stroke='%23fff' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center / 100% no-repeat,
        var(--gf-grad);
}
.gf-checks b { color: var(--gf-ink); font-weight: 700; }
.gf-spot--dark .gf-checks b { color: #fff; }

/* ==========================================================================
   TOOLKIT (tabs)
   ========================================================================== */
.gf-tools { background: var(--gf-soft); }
.gf-tabs { display: flex; flex-wrap: wrap; justify-content: center; gap: .5rem; margin-bottom: 1.6rem; }
.gf-tab {
    display: inline-flex; align-items: center; gap: .45rem; padding: .6rem 1rem; border-radius: 2rem; cursor: pointer;
    font-size: .74rem; font-weight: 700; color: var(--gf-ink); background: #fff; border: 1px solid var(--gf-line);
    transition: color .25s ease, background .25s ease, border-color .25s ease, box-shadow .25s ease;
}
.gf-tab i { font-size: .95rem; color: var(--gf-green); }
.gf-tab .c { min-width: 1.3rem; padding: .08rem .35rem; border-radius: 1rem; font-size: .6rem; color: var(--gf-green-2); background: rgba(16, 163, 111, .1); }
.gf-tab:hover { border-color: rgba(16, 163, 111, .4); }
.gf-tab.is-active { color: #fff; background: var(--gf-grad); border-color: transparent; box-shadow: 0 .8rem 1.6rem -.8rem rgba(16, 163, 111, .75); }
.gf-tab.is-active i { color: #fff; }
.gf-tab.is-active .c { color: #fff; background: rgba(255, 255, 255, .22); }
.gf-tab:focus-visible { outline: 2px solid var(--gf-green); outline-offset: 3px; }
.gf-page .gf-panel-title { margin: 0 0 .8rem; font-size: .9rem; font-weight: 700; color: var(--gf-ink); }
.gf-js .gf-page .gf-panel-title { position: absolute; width: 1px; height: 1px; margin: 0; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
/* without JS every panel is visible; with JS only the active one */
.gf-js .gf-panel:not(.is-active) { display: none; }
.gf-panel + .gf-panel { margin-top: 1.2rem; }
.gf-js .gf-panel + .gf-panel { margin-top: 0; }
.gf-tool-grid { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(15.5rem, 1fr)); gap: .8rem; }
.gf-tool {
    display: flex; gap: .8rem; padding: 1rem 1.05rem; border-radius: 1.05rem;
    background: #fff; border: 1px solid var(--gf-line);
    box-shadow: 0 .8rem 1.6rem -1.5rem rgba(11, 42, 32, .45);
    transition: transform .3s cubic-bezier(.2, .8, .2, 1), border-color .3s ease;
}
.gf-tool:hover { transform: translateY(-3px); border-color: rgba(16, 163, 111, .3); }
.gf-tool .ic { flex: none; display: grid; place-items: center; width: 2.2rem; height: 2.2rem; border-radius: .7rem; font-size: 1.1rem; color: var(--gf-green-2); background: linear-gradient(135deg, rgba(16, 163, 111, .12), rgba(190, 242, 100, .2)); }
.gf-page .gf-tool h4 { margin: .1rem 0 0; font-size: .8rem; font-weight: 700; color: var(--gf-ink); }
.gf-tool p { margin: .25rem 0 0; font-size: .68rem; line-height: 1.55; color: var(--gf-muted); }

/* ==========================================================================
   SCREEN GALLERY
   ========================================================================== */
.gf-gallery {
    overflow: hidden; isolation: isolate; padding-bottom: 3.5rem;
    background:
        radial-gradient(50% 60% at 50% 0%, rgba(16, 163, 111, .28) 0%, transparent 65%),
        linear-gradient(180deg, #041a13 0%, #03130e 100%);
}
.gf-gallery .gf-head { margin-bottom: 2rem; }
.gf-reel {
    position: relative; z-index: 1; overflow-x: auto; overscroll-behavior-x: contain; scroll-snap-type: x proximity;
    scrollbar-width: none; padding: .5rem 0 1rem;
    -webkit-mask-image: linear-gradient(90deg, transparent, #000 6%, #000 94%, transparent);
    mask-image: linear-gradient(90deg, transparent, #000 6%, #000 94%, transparent);
}
.gf-reel::-webkit-scrollbar { display: none; }
.gf-reel:focus-visible { outline: 2px solid var(--gf-leaf); outline-offset: -2px; }
.gf-reel-track { list-style: none; margin: 0; padding: 0 max(1.5rem, calc((100vw - 1140px) / 2)); display: flex; gap: 1.1rem; width: max-content; }
.gf-reel-track li { flex: none; width: 12rem; scroll-snap-align: center; transition: transform .35s cubic-bezier(.2, .8, .2, 1); }
.gf-reel-track li:nth-child(even) { margin-top: 2rem; }
.gf-reel-track li:hover { transform: translateY(-.5rem); }
.gf-reel-track img { display: block; width: 100%; height: auto; filter: drop-shadow(0 1.4rem 1.6rem rgba(0, 0, 0, .5)); }

/* ==========================================================================
   IMPORT & EXPORT FORMATS
   ========================================================================== */
.gf-formats { background: #fff; }
.gf-formats-grid { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); align-items: center; gap: 3.5rem; }
.gf-units { margin-top: 1.6rem; display: grid; gap: .7rem; }
.gf-units-title { display: inline-flex; align-items: center; gap: .4rem; font-size: .74rem; font-weight: 700; color: var(--gf-ink); }
.gf-units-title i { font-size: 1rem; color: var(--gf-green); }
.gf-units ul { list-style: none; margin: 0 0 .3rem; padding: 0; display: flex; flex-wrap: wrap; gap: .4rem; }
.gf-units li { padding: .3rem .65rem; border-radius: 2rem; font-size: .66rem; font-weight: 600; color: var(--gf-ink); background: var(--gf-soft); border: 1px solid var(--gf-line); }
.gf-fmt-table {
    border-radius: 1.4rem; overflow: hidden; background: #fff; border: 1px solid var(--gf-line);
    box-shadow: 0 1.8rem 3rem -2.2rem rgba(11, 42, 32, .5);
}
.gf-fmt-row { display: grid; grid-template-columns: minmax(0, 1fr) 4.5rem 4.5rem; align-items: center; padding: .75rem 1.3rem; }
.gf-fmt-row + .gf-fmt-row { border-top: 1px solid var(--gf-line); }
.gf-fmt-row > span { font-size: .78rem; font-weight: 600; color: var(--gf-ink); }
.gf-fmt-row > span:not(:first-child) { text-align: center; }
.gf-fmt-row > span:first-child { display: flex; align-items: center; gap: .75rem; }
.gf-fmt-row .ext {
    flex: none; display: grid; place-items: center; width: 3.6rem; padding: .32rem 0; border-radius: .55rem;
    font-size: .58rem; font-weight: 700; letter-spacing: .02em; color: var(--gf-green-2);
    background: linear-gradient(135deg, rgba(16, 163, 111, .12), rgba(190, 242, 100, .2));
}
.gf-fmt-row > span:first-child > span { display: flex; flex-direction: column; min-width: 0; line-height: 1.3; }
.gf-fmt-row small { font-size: .64rem; font-weight: 500; color: var(--gf-muted); }
.gf-fmt-row--head { background: var(--gf-soft); padding-block: .85rem; }
.gf-fmt-row--head > span { font-size: .62rem; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; color: var(--gf-muted); }
.gf-fmt-row .yes { font-size: 1.2rem; color: var(--gf-green); }
.gf-fmt-row .no { font-size: 1rem; color: #b3c0ba; }

/* ==========================================================================
   PERMISSIONS
   ========================================================================== */
.gf-perms { background: var(--gf-soft); }
.gf-perm-grid { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 1rem; }
.gf-perm-grid li { padding: 1.3rem 1.2rem; border-radius: 1.2rem; background: #fff; border: 1px solid var(--gf-line); }
.gf-perm-grid .ic { display: grid; place-items: center; width: 2.4rem; height: 2.4rem; border-radius: .75rem; font-size: 1.2rem; color: #fff; background: var(--gf-grad); box-shadow: 0 .6rem 1.2rem -.5rem rgba(16, 163, 111, .7); }
.gf-page .gf-perm-grid h3 { margin: .9rem 0 0; font-size: .86rem; font-weight: 700; color: var(--gf-ink); }
.gf-perm-grid p { margin: .35rem 0 0; font-size: .7rem; line-height: 1.6; }
.gf-perm-links { margin: 1.6rem 0 0; text-align: center; font-size: .78rem; }
.gf-perm-links a { font-weight: 700; color: var(--gf-green-2); }

/* ==========================================================================
   FAQ
   ========================================================================== */
.gf-faq { background: #fff; }
.gf-faq-grid { display: grid; grid-template-columns: minmax(0, 4fr) minmax(0, 7fr); gap: 3rem; align-items: start; }
.gf-faq-head { position: sticky; top: 6rem; }
.gf-faq-list { display: grid; gap: .6rem; }
.gf-qa { border-radius: 1rem; background: var(--gf-soft); border: 1px solid var(--gf-line); transition: background .25s ease, border-color .25s ease; }
.gf-qa[open] { background: #fff; border-color: rgba(16, 163, 111, .3); box-shadow: 0 1rem 2rem -1.6rem rgba(16, 163, 111, .55); }
.gf-qa summary { display: flex; align-items: center; justify-content: space-between; gap: 1rem; padding: .95rem 1.1rem; cursor: pointer; list-style: none; }
.gf-qa summary::-webkit-details-marker { display: none; }
.gf-page .gf-qa h3 { margin: 0; font-size: .84rem; font-weight: 700; line-height: 1.4; color: var(--gf-ink); }
.gf-qa summary i { flex: none; display: grid; place-items: center; width: 1.6rem; height: 1.6rem; border-radius: 50%; font-size: .95rem; color: var(--gf-green); background: rgba(16, 163, 111, .1); transition: transform .3s ease; }
.gf-qa[open] summary i { transform: rotate(45deg); }
.gf-qa summary:focus-visible { outline: 2px solid var(--gf-green); outline-offset: 2px; border-radius: 1rem; }
.gf-qa p { margin: 0; padding: 0 1.1rem 1.05rem; font-size: .76rem; line-height: 1.7; }

/* ==========================================================================
   FINAL CTA
   ========================================================================== */
.gf-cta {
    padding: 4.5rem 0; overflow: hidden; isolation: isolate;
    background:
        radial-gradient(45% 70% at 50% 110%, rgba(16, 163, 111, .45) 0%, transparent 70%),
        linear-gradient(180deg, #03130e 0%, #05201a 100%);
}
.gf-cta-card { position: relative; z-index: 1; max-width: 42rem; margin: 0 auto; text-align: center; }
.gf-cta-card > img { width: 4rem; height: 4rem; border-radius: 1.05rem; box-shadow: 0 1rem 2.4rem -.6rem rgba(16, 163, 111, .7), 0 0 0 1px rgba(255, 255, 255, .12); }
.gf-cta .gf-stores { margin-top: 1.6rem; }
.gf-cta-links { margin: 1.8rem 0 0; font-size: .74rem; color: #6c8c7e; }
.gf-cta-links a { margin: 0 .35rem; font-weight: 600; color: #c4e4d4; }
.gf-cta-links a:hover { color: #fff; }
.gf-built { margin: .8rem 0 0; font-size: .66rem; color: #6c8c7e; }
.gf-built a { color: #9be8c4; }

/* ==========================================================================
   REVEAL (armed by JS only)
   ========================================================================== */
.gf-reveal-on .gf-spot-grid:not(.is-in) .gf-phone { opacity: 0; translate: 0 2rem; }
.gf-reveal-on .gf-spot-grid .gf-phone { transition: opacity .8s ease, translate .9s cubic-bezier(.2, .8, .2, 1); }
.gf-reveal-on .gf-spot-grid .s-front { transition-delay: .12s; }
.gf-reveal-on .gf-stats li:not(.is-in), .gf-reveal-on .gf-perm-grid li:not(.is-in) { opacity: 0; translate: 0 1rem; }
.gf-reveal-on .gf-stats li, .gf-reveal-on .gf-perm-grid li { transition: opacity .6s ease var(--d, 0s), translate .7s cubic-bezier(.2, .8, .2, 1) var(--d, 0s); }

/* ==========================================================================
   LEGAL PAGES
   ========================================================================== */
.gf-legal-hero {
    margin-top: -120px; padding: calc(120px + 2.2rem) 0 2.6rem;
    overflow: hidden; isolation: isolate; color: #cde3d8;
    background:
        radial-gradient(50% 90% at 85% 0%, rgba(16, 163, 111, .34) 0%, transparent 65%),
        linear-gradient(180deg, #020f0b 0%, #072a1f 100%);
}
.gf-crumbs { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: .35rem; font-size: .66rem; }
.gf-crumbs li + li::before { content: "/"; margin-right: .35rem; color: #5d7f70; }
.gf-crumbs a { color: #9be8c4; }
.gf-crumbs a:hover { color: #fff; }
.gf-crumbs [aria-current] { color: #cde3d8; }
.gf-legal-title { display: flex; align-items: center; gap: 1rem; margin-top: 1.4rem; }
.gf-legal-title img { width: 3.2rem; height: 3.2rem; border-radius: .85rem; box-shadow: 0 .8rem 1.8rem -.4rem rgba(16, 163, 111, .6); }
.gf-legal-title .app { margin: 0; font-size: .72rem; font-weight: 600; color: #9be8c4; }
.gf-page .gf-legal-title h1 { margin: .1rem 0 0; color: #fff; font-weight: 800; letter-spacing: -.03em; line-height: 1.05; font-size: clamp(1.8rem, 4vw, 2.8rem); }
.gf-legal-dates { display: flex; flex-wrap: wrap; gap: .5rem 1.2rem; margin: 1.1rem 0 0; font-size: .68rem; color: #a7c4b7; }
.gf-legal-dates i { color: var(--gf-leaf); margin-right: .2rem; }

.gf-legal-body { padding: 3rem 0 4rem; background: var(--gf-soft); }
.gf-legal-grid { display: grid; grid-template-columns: minmax(0, 15rem) minmax(0, 1fr); gap: 2.5rem; align-items: start; }
.gf-toc { position: sticky; top: 6rem; }
.gf-toc details { padding: 1rem 1rem .8rem; border-radius: 1rem; background: #fff; border: 1px solid var(--gf-line); }
.gf-toc summary { font-size: .64rem; font-weight: 700; letter-spacing: .07em; text-transform: uppercase; color: var(--gf-muted); cursor: pointer; list-style: none; }
.gf-toc summary::-webkit-details-marker { display: none; }
.gf-toc ol { margin: .7rem 0 0; padding: 0; list-style: none; counter-reset: toc; display: grid; gap: .1rem; max-height: calc(100vh - 14rem); overflow-y: auto; }
.gf-toc li { counter-increment: toc; }
.gf-toc ol a { display: flex; gap: .45rem; padding: .32rem .5rem; border-radius: .5rem; font-size: .68rem; font-weight: 600; line-height: 1.35; color: var(--gf-muted); text-decoration: none; }
.gf-toc ol a::before { content: counter(toc); flex: none; min-width: 1rem; font-variant-numeric: tabular-nums; color: #a9bab2; }
.gf-toc ol a:hover { color: var(--gf-ink); background: var(--gf-soft); }
.gf-toc ol a.is-active { color: var(--gf-green-2); background: rgba(16, 163, 111, .08); }
.gf-toc ol a.is-active::before { color: var(--gf-green); }
.gf-toc-back { display: inline-flex; align-items: center; gap: .3rem; margin-top: .9rem; font-size: .68rem; font-weight: 700; color: var(--gf-green-2); }

.gf-doc {
    min-width: 0; padding: 2.2rem 2.4rem; border-radius: 1.4rem; background: #fff; border: 1px solid var(--gf-line);
    box-shadow: 0 1.6rem 3rem -2.6rem rgba(11, 42, 32, .5);
    font-size: .8rem; line-height: 1.8; color: #3d5249;
}
.gf-doc section { scroll-margin-top: 6rem; }
.gf-doc section + section { margin-top: 2rem; padding-top: 2rem; border-top: 1px solid var(--gf-line); }
.gf-page .gf-doc h2 { margin: 0 0 .7rem; font-size: 1.05rem; font-weight: 800; letter-spacing: -.02em; color: var(--gf-ink); }
.gf-page .gf-doc h3 { margin: 1.2rem 0 .4rem; font-size: .82rem; font-weight: 700; color: var(--gf-ink); }
.gf-doc p { margin: 0 0 .7rem; }
.gf-doc ul { margin: 0 0 .7rem; padding-left: 1.1rem; }
.gf-doc li { margin-bottom: .45rem; }
.gf-doc li::marker { color: var(--gf-green); }
.gf-doc strong { color: var(--gf-ink); }
.gf-doc a { color: var(--gf-green-2); font-weight: 600; }
.gf-glance { list-style: none; padding: 0 !important; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .7rem; }
.gf-glance li { display: flex; gap: .7rem; margin: 0; padding: .85rem .9rem; border-radius: .9rem; background: var(--gf-soft); border: 1px solid var(--gf-line); }
.gf-glance i { flex: none; display: grid; place-items: center; width: 2rem; height: 2rem; border-radius: .6rem; font-size: 1rem; color: #fff; background: var(--gf-grad); }
.gf-glance b { display: block; font-size: .76rem; line-height: 1.35; color: var(--gf-ink); }
.gf-glance span { display: block; margin-top: .15rem; font-size: .68rem; line-height: 1.5; color: var(--gf-muted); }
.gf-table-wrap { overflow-x: auto; margin: .4rem 0 .6rem; border-radius: .9rem; border: 1px solid var(--gf-line); }
.gf-table { width: 100%; border-collapse: collapse; font-size: .74rem; line-height: 1.55; }
.gf-table th { padding: .65rem .9rem; text-align: left; font-size: .6rem; letter-spacing: .06em; text-transform: uppercase; color: var(--gf-muted); background: var(--gf-soft); }
.gf-table td { padding: .7rem .9rem; vertical-align: top; border-top: 1px solid var(--gf-line); }
.gf-table td:first-child { width: 32%; font-weight: 700; color: var(--gf-ink); }
.gf-address { margin: 0; padding: 1rem 1.1rem; border-radius: .9rem; font-style: normal; background: var(--gf-soft); border: 1px solid var(--gf-line); }
.gf-doc-foot { margin-top: 2.2rem; padding-top: 1.2rem; border-top: 1px dashed rgba(11, 42, 32, .15); font-size: .74rem; }
.gf-doc-foot p { margin: 0 0 .3rem; }

/* ==========================================================================
   RESPONSIVE
   ========================================================================== */
@media (max-width: 1199.98px) {
    .gf-tool-grid { grid-template-columns: repeat(auto-fill, minmax(14rem, 1fr)); }
    .gf-perm-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 991.98px) {
    .gf-section { padding: 3.5rem 0; }
    .gf-hero-grid { grid-template-columns: minmax(0, 1fr); text-align: center; }
    .gf-hero-app, .gf-stores { justify-content: center; }
    .gf-hero-lead { margin-inline: auto; }
    .gf-hero-visual { max-width: 28rem; margin-top: 1rem; }
    .gf-stats { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .gf-spot-grid, .gf-formats-grid { grid-template-columns: minmax(0, 1fr); gap: 2rem; }
    .gf-spot-grid .gf-spot-media, .gf-spot-grid--rev .gf-spot-media { order: -1; max-width: 24rem; }
    .gf-faq-grid { grid-template-columns: minmax(0, 1fr); gap: 1.6rem; }
    .gf-faq-head { position: static; text-align: center; }
    .gf-legal-grid { grid-template-columns: minmax(0, 1fr); gap: 1.2rem; }
    .gf-toc { position: static; }
    .gf-toc details:not([open]) { padding-bottom: 1rem; }
    .gf-toc ol { max-height: none; grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 575.98px) {
    .gf-hero { padding-top: calc(120px + 1.4rem); }
    .gf-float.f1 { left: 0; top: 64%; }
    .gf-float.f2 { right: 0; top: 4%; }
    .gf-float.f3 { display: none; }
    .gf-stores { flex-direction: column; align-items: stretch; }
    .gf-store { justify-content: center; }
    .gf-stats li { padding: 1rem .6rem; }
    .gf-stats .n { font-size: 1.8rem; }
    /* tabs become one swipeable row that bleeds to the screen edges */
    .gf-tabs {
        flex-wrap: nowrap; justify-content: flex-start; overflow-x: auto; scrollbar-width: none;
        margin-inline: calc(var(--bs-gutter-x, 1.5rem) * -.5); margin-bottom: .6rem; padding: .2rem calc(var(--bs-gutter-x, 1.5rem) * .5) 1.3rem;
    }
    .gf-tabs::-webkit-scrollbar { display: none; }
    .gf-tab { flex: none; font-size: .68rem; padding: .5rem .8rem; }
    .gf-tool-grid { grid-template-columns: minmax(0, 1fr); gap: .5rem; }
    .gf-tool { padding: .75rem .85rem; }
    .gf-tool:hover { transform: none; }
    .gf-perm-grid { grid-template-columns: minmax(0, 1fr); gap: .6rem; }
    .gf-perm-grid li { display: grid; grid-template-columns: auto minmax(0, 1fr); column-gap: .85rem; padding: .95rem 1rem; }
    .gf-perm-grid .ic { grid-row: span 2; width: 2.1rem; height: 2.1rem; font-size: 1.05rem; }
    .gf-page .gf-perm-grid h3 { margin: 0; }
    .gf-perm-grid p { margin-top: .2rem; }
    .gf-section { padding: 3rem 0; }
    .gf-head { margin-bottom: 1.8rem; }
    .gf-spot-grid .gf-spot-media, .gf-spot-grid--rev .gf-spot-media { max-width: 21rem; }
    .gf-fmt-row { grid-template-columns: minmax(0, 1fr) 3.2rem 3.4rem; padding: .7rem .9rem; }
    .gf-fmt-row > span { font-size: .72rem; }
    .gf-fmt-row .ext { width: 3rem; font-size: .52rem; }
    .gf-reel-track li { width: 9.5rem; }
    .gf-doc { padding: 1.4rem 1.15rem; }
    .gf-glance { grid-template-columns: minmax(0, 1fr); }
    .gf-toc ol { grid-template-columns: minmax(0, 1fr); }
    .gf-table td:first-child { width: 38%; }
}
@media (prefers-reduced-motion: reduce) {
    .gf-hero-visual .gf-phone, .gf-float, .gf-plot polygon, .gf-ticker-track { animation: none !important; }
    .gf-tool, .gf-reel-track li, .gf-store, .gf-qa summary i { transition: none; }
    .gf-tool:hover, .gf-reel-track li:hover { transform: none; }
}