/* GravenReach Media — the plain service-page template (24 Oct 2026). Used by the search pages that sit at the site
   root (/logo-design-chennai/, the cost guides, the area pages). Built on tokens.css: a t1 hero, then whitewash
   reading sections, one t6 contact band. No motion; nothing loads below the fold at opacity 0. */
.pg-wrap { max-width: 1120px; margin: 0 auto; }
.pg-read { max-width: var(--measure); }
.pg-crumbs { font-family: var(--font-mono); font-size: var(--fs-small); margin: 0 0 18px; }
.pg-crumbs ol { list-style: none; padding: 0; margin: 0; display: flex; flex-wrap: wrap; gap: 4px 10px; }
.pg-crumbs li + li::before { content: "/"; margin-right: 10px; opacity: .7; }
.pg-crumbs a { color: inherit; }

.pg-hero { padding-top: 36px; padding-bottom: 56px; }
.pg-hero h1 { font-family: var(--font-display); font-weight: 900; line-height: 1.04; letter-spacing: -0.01em;
              font-size: clamp(38px, 8vw, 84px); margin: 0; max-width: 16ch; color: var(--t1-letter); }
.pg-hero .pg-answer { font-size: 20px; line-height: 1.45; font-weight: 600; max-width: 40ch; margin: 20px 0 0; color: var(--t1-shade); }
.pg-hero .pg-facts { list-style: none; padding: 0; margin: 22px 0 0; display: flex; flex-wrap: wrap; gap: 10px; }
.pg-hero .pg-facts li { font-family: var(--font-mono); font-size: var(--fs-small); padding: 6px 12px; border: 1.5px solid var(--t1-shade);
                        border-radius: 999px; color: var(--t1-shade); }
.pg-actions { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 28px; }
.pg-actions a { display: inline-flex; align-items: center; gap: 8px; min-height: 48px; padding: 12px 18px; border-radius: 4px;
                font-weight: 800; text-decoration: none; }
.pg-actions .pg-call { background: var(--t1-shade); color: var(--t1-ground); }
.pg-actions .pg-wa { background: var(--t1-letter); color: #fff; }
.pg-actions .pg-ask { color: var(--t1-shade); text-decoration: underline; text-underline-offset: 4px; padding-left: 4px; padding-right: 4px; }

.pg-body { background: var(--whitewash); color: var(--ink); }
.pg-body h2 { font-family: var(--font-display); font-weight: 900; font-size: clamp(28px, 5vw, 44px); line-height: 1.08; margin: 0 0 16px; }
.pg-body h3 { font-family: var(--font-display); font-weight: 800; font-size: 22px; line-height: 1.2; margin: 26px 0 8px; }
.pg-body p { margin: 0 0 14px; max-width: var(--measure); }
.pg-body ul, .pg-body ol { max-width: var(--measure); padding-left: 22px; margin: 0 0 14px; }
.pg-body li { margin: 0 0 6px; }
.pg-body a { color: var(--t5-letter); text-underline-offset: 3px; }
.pg-body section + section { margin-top: 44px; padding-top: 36px; border-top: 2px solid var(--ink); }

.pg-table { width: 100%; max-width: 760px; border-collapse: collapse; margin: 6px 0 18px; font-size: var(--fs-body); }
.pg-table th, .pg-table td { text-align: left; vertical-align: top; padding: 10px 12px; border-bottom: 1.5px solid rgba(21,21,21,.25); }
.pg-table th { font-family: var(--font-mono); font-size: var(--fs-small); font-weight: 400; }
.pg-table td.pg-num { white-space: nowrap; font-weight: 800; }
.pg-scroll { overflow-x: auto; -webkit-overflow-scrolling: touch; }

.pg-faq details { border-top: 1.5px solid var(--ink); max-width: var(--measure); }
.pg-faq details:last-of-type { border-bottom: 1.5px solid var(--ink); }
.pg-faq summary { cursor: pointer; list-style: none; padding: 16px 36px 16px 0; position: relative; font-weight: 800; font-size: 19px; line-height: 1.35; }
.pg-faq summary::-webkit-details-marker { display: none; }
.pg-faq summary::after { content: "+"; position: absolute; right: 4px; top: 12px; font-size: 26px; font-weight: 400; }
.pg-faq details[open] summary::after { content: "−"; }
.pg-faq details > div { padding: 0 0 16px; }
.pg-faq h3 { all: unset; }

.pg-next { list-style: none; padding: 0; margin: 0; display: grid; gap: 10px; max-width: 620px; }
.pg-next a { display: flex; justify-content: space-between; gap: 12px; padding: 14px 16px; background: var(--ink); color: var(--whitewash);
             border-radius: 4px; text-decoration: none; font-weight: 700; }

.pg-contact h2 { font-family: var(--font-display); font-weight: 900; font-size: clamp(28px, 5vw, 44px); line-height: 1.08; margin: 0 0 12px; }
.pg-contact p { margin: 0 0 10px; max-width: var(--measure); }
.pg-contact a { color: inherit; }
.pg-contact .pg-actions .pg-call { background: var(--t6-letter); color: var(--t6-ground); }
.pg-contact .pg-actions .pg-wa { background: var(--whitewash); color: var(--ink); }
.pg-contact .pg-actions .pg-ask { color: var(--t6-letter); }
.pg-updated { font-family: var(--font-mono); font-size: var(--fs-small); margin-top: 18px; }