/* Generated by Unnati GeoRank — https://georank.co.in
GeoRank stylesheet — generated from the Design tab. Layout CSS is shared
across every theme; only the :root tokens above change. Add your own
overrides in the Advanced CSS box on the Design tab, not here directly —
this whole file is rewritten every time a theme is applied. */
:root{
--max-w: 1100px;
--font: -apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,Arial,sans-serif;
--font-size-base: 17px;
--line-height-base: 1.7;
--body-weight: 400;
--font-heading: Georgia,'Times New Roman',serif;
--heading-weight: 600;
--h1-weight: 700;
--heading-transform: none;
--heading-tracking: -0.01em;
--h1-tracking: -0.03em;
--h2-tracking: -0.02em;
--text: #12181f;
--muted: #54626f;
--bg: #ffffff;
--surface: #f3f6f9;
--border: #dbe3ea;
--accent: #154273;
--accent-rgb: 21,66,115;
--accent-dark: #0f3457;
--radius: 8px;
--header-bg: #03104f;
--header-text: #12181f;
--footer-bg: #f3f6f9;
--footer-text: #54626f;
--menu-bg: var(--header-bg);
--menu-text: var(--header-text);
--menu-accent: var(--accent);
--menu-panel-text: var(--menu-text);
--menu-accent-tint: rgba(0,0,0,.06);
--header-height: 100px;
--logo-height: 80px;
--logo-max-width: 250px;
}
*{box-sizing:border-box;}
html{-webkit-text-size-adjust:100%;}
body{margin:0;font-family:var(--font);font-size:var(--font-size-base);font-weight:var(--body-weight);color:var(--text);background:var(--bg);line-height:var(--line-height-base);}
/* height:auto is load-bearing, not decorative: every inserted carries
real width/height attributes (see dimAttrsFor()) so the box doesn't jump
around while the file loads. Pairing max-width:100% with those attributes
alone is NOT enough to keep the image proportional once it shrinks to fit
a narrower column — some browsers hold the attribute height as a literal
pixel value until an explicit height rule tells them otherwise, squashing
or stretching the image instead of scaling it. height:auto is what makes
width and height shrink together. Round 41. */
img{max-width:100%;height:auto;display:block;}
a{color:var(--accent);text-decoration:none;}
a:hover{text-decoration:underline;}
.container{max-width:var(--max-w);margin:0 auto;padding:0 20px;}
/* Sitewide heading hierarchy (Round 50 / Typography spec). Previously h1-h6
carried NO sitewide font-size/weight rule at all — only individual
components (.hero h1, .section-title, .card h3, etc.) set their own sizes,
so a heading typed anywhere else fell back to the bare browser default.
These rules give every heading a real, theme-driven size/weight/tracking
by default while staying strictly less specific than any existing
component selector (".hero h1" etc. still wins by specificity, so nothing
already styled changes). H1 uses --h1-weight/--h1-tracking (one step
heavier + its own tracking, see georank_build_style_css()); H2 uses
--h2-tracking; H3-H6 share --heading-weight/--heading-tracking. */
h1,h2,h3,h4,h5,h6,.logo{font-family:var(--font-heading);text-transform:var(--heading-transform);}
h1{font-weight:var(--h1-weight);letter-spacing:var(--h1-tracking);font-size:clamp(28px,4vw + 14px,40px);line-height:1.2;margin:0 0 16px;}
h2{font-weight:var(--heading-weight);letter-spacing:var(--h2-tracking);font-size:clamp(22px,2vw + 14px,30px);line-height:1.25;margin:0 0 14px;}
h3,h4,h5,h6{font-weight:var(--heading-weight);letter-spacing:var(--heading-tracking);}
h3{font-size:clamp(18px,1vw + 14px,22px);line-height:1.3;margin:0 0 12px;}
h4{font-size:18px;line-height:1.35;margin:0 0 10px;}
h5{font-size:16px;line-height:1.4;margin:0 0 8px;}
h6{font-size:14px;line-height:1.4;margin:0 0 8px;}
/* Fallback containment (Round 45) — a heading/paragraph/list typed directly
into a page's content region (not wrapped in .hero, .container, or one of
the .georank-* quick-insert blocks, which each already carry their own
max-width/margin:auto) sits as a direct child of and previously had
NO width constraint at all — it stretched edge-to-edge, visually
misaligned/left-hanging against every properly-contained block around it.
This is exactly the "some blocks left aligned, especially the h1" report:
nothing in the template ever put a container around bare typed content.
Scoped to `body > *` so it can never reach inside an already-contained
block (a .georank-imgtext's own
, a .hero's own
, a
inside
a .georank-panel, etc. are all nested, not direct children of body, so
this rule never touches them and never double-constrains anything). */
body > h1, body > h2, body > h3, body > h4, body > h5, body > h6,
body > p, body > ul, body > ol, body > blockquote, body > table, body > figure {
max-width: var(--max-w);
margin-left: auto;
margin-right: auto;
padding-left: 20px;
padding-right: 20px;
}
/* Header / nav */
.site-header{border-bottom:1px solid var(--border);position:sticky;top:0;background:var(--header-bg);z-index:50;min-height:var(--header-height);}
.header-inner{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;min-height:var(--header-height);padding:10px 20px;gap:10px;}
.logo{font-weight:700;font-size:18px;color:var(--header-text);display:flex;align-items:center;height:var(--logo-height);}
.logo img{height:var(--logo-height);max-width:var(--logo-max-width);width:auto;object-fit:contain;display:block;margin-right:10px;}
.nav-toggle{display:inline-block;background:var(--surface);color:var(--text);border:1px solid var(--border);border-radius:8px;font-size:18px;padding:6px 10px;cursor:pointer;}
/* Styles the 3-bar hamburger icon some header.html edits build the button
from instead of a text character — a no-op (no matching elements) on a
header.html that still uses the plain "☰" character button. */
.nav-toggle span{display:block;width:18px;height:2px;margin:4px 0;background:var(--text);border-radius:1px;}
.site-nav{display:none;flex-direction:column;gap:4px;width:100%;padding-top:10px;}
.site-nav.open{display:flex;}
/* Round 52 — button-style nav links: rounded, no underline (the sitewide
a:hover underline never applied here anyway since this is more specific),
with hover AND the current page sharing one "pressed" look — a translucent
wash of the menu's own accent color, via a per-preset --menu-accent-tint
(see georank_nav_menu_style_presets()) rather than a solid fill, so it
reads as a highlight, not a second button style. aria-current="page" is
set at runtime by the tiny script georank_nav_active_script() emits right
after this