
:root{--ink:#1f2937;--muted:#6b7280;--bg:#f6fef6;--brand:#0d7f4d;--line:#e5e7eb}
*{box-sizing:border-box} body{margin:0;font-family:Inter,system-ui,-apple-system,Segoe UI,Roboto,Helvetica,Arial,sans-serif;color:var(--ink);background:var(--bg)}
a{text-decoration:none;color:inherit} img{max-width:100%;display:block}
.gt-container{max-width:1120px;margin:0 auto;padding:0 16px}
.gt-btn{display:inline-block;background:var(--brand);color:#fff;padding:12px 18px;border-radius:10px}
.gt-muted{color:var(--muted)}
/* Header */
.gt-header{position:sticky;top:0;background:#fff;border-bottom:1px solid var(--line);z-index:50}
.gt-header-inner{display:flex;align-items:center;justify-content:space-between;height:64px}
.gt-menu{display:flex;gap:20px;list-style:none;margin:0;padding:0}
.gt-menu li a{padding:8px 4px;border-radius:8px} .gt-menu li a:hover{background:#f0f2f5}
/* Hero */
.gt-hero{background:#e6f7ff}
.gt-hero-inner{padding:48px 0}
.gt-hero-copy h1{margin:0 0 8px 0;font-size:40px;line-height:1.1}
.gt-preview{margin-top:12px}
.gt-preview-bar{height:10px;background:#eef2ff;border-radius:999px;overflow:hidden}
.gt-preview-bar span{display:block;height:100%;background:var(--brand)}
/* Tea Facts */
.gt-tea-facts{padding:36px 0;background:#f0faf2;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.gt-facts-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;margin-top:12px}
.gt-fact-card{background:#fff;border:1px solid var(--line);border-radius:16px;padding:0;overflow:hidden}
.gt-card-link{display:flex;flex-direction:column;gap:10px;padding:16px}
.gt-card-link:hover{background:#f9fafb}
.gt-fact-card img{width:100%;height:160px;object-fit:cover;background:#eef2ff}
.gt-fact-card h3{margin:0}
.gt-fact-desc{color:var(--ink);opacity:0.9;margin:0}
.gt-cta{display:inline-block;margin-top:6px;color:#2563eb;font-weight:600}
/* Posts */
.gt-posts{padding:36px 0}
.gt-section-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:12px}
.gt-post-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.gt-post-card{background:#fff;border:1px solid var(--line);border-radius:16px;overflow:hidden}
.gt-post-card h3{margin:12px} .gt-post-card .gt-excerpt{margin:0 12px 14px 12px;color:var(--muted)}
/* Newsletter */
.gt-newsletter-cta{padding:36px 0;background:#fff}
.gt-newsletter-inner{display:grid;grid-template-columns:1.5fr 1fr;gap:16px;align-items:center}
.gt-newsletter{display:flex;gap:8px}
.gt-newsletter input{flex:1;border:1px solid var(--line);border-radius:10px;padding:12px}
.gt-newsletter button{background:var(--brand);color:#fff;border:none;border-radius:10px;padding:12px 18px}
/* Footer */
.gt-footer{background:#f8fafc;border-top:1px solid var(--line);margin-top:40px}
.gt-footer-grid{display:grid;grid-template-columns:1.2fr 1fr 1fr;gap:16px;padding:24px 0}
.gt-links{list-style:none;margin:0;padding:0;display:flex;gap:16px;flex-wrap:wrap}.gt-links li{margin:0}
.gt-copy{padding:12px 0;border-top:1px solid var(--line);font-size:12px;color:var(--muted)}
/* Mobile sticky quiz button */
.gt-sticky-quiz{position:fixed;left:16px;right:16px;bottom:16px;display:none;z-index:1000;background:var(--brand);color:#fff;text-align:center;padding:14px 18px;border-radius:999px;box-shadow:0 6px 18px rgba(0,0,0,.15)}
@supports(padding: max(0px)){ .gt-sticky-quiz{ padding-bottom: max(14px, env(safe-area-inset-bottom)); } }
@media (max-width:768px){ .gt-sticky-quiz{display:block;} }
/* Responsive */
@media (max-width:1024px){
  .gt-facts-grid{grid-template-columns:repeat(2,1fr)}
  .gt-post-grid{grid-template-columns:repeat(2,1fr)}
  .gt-hero-copy h1{font-size:32px}
}
@media (max-width:640px){
  .gt-facts-grid{grid-template-columns:1fr}
  .gt-post-grid{grid-template-columns:1fr}
}

.gt-post-card img{width:100%;aspect-ratio:1/1;object-fit:cover;display:block}

/* Post content links: red + underlined */
.single 

/* --- Mobile overflow fixes --- */
html, body{max-width:100%;overflow-x:hidden}

/* Footer and newsletter grids: collapse on smaller screens */
@media (max-width:1024px){
  .gt-footer-grid{grid-template-columns:1fr 1fr}
  .gt-newsletter-inner{grid-template-columns:1fr}
}
@media (max-width:640px){
  .gt-footer-grid{grid-template-columns:1fr}
  .gt-newsletter-inner{grid-template-columns:1fr}
}

/* Ensure inputs/buttons don't overflow small columns */
.gt-newsletter input{min-width:0}
.gt-newsletter{flex-wrap:wrap}

/* --- Sticky quiz button overflow fix --- */
.gt-sticky-quiz{
  position: fixed;
  left: 16px;
  right: 16px;
  bottom: 16px;
  max-width: calc(100vw - 32px);
  width: calc(100vw - 32px);
  box-sizing: border-box;
  transform: translateZ(0);
  will-change: transform;
}
@supports (left: max(0px)){
  .gt-sticky-quiz{
    left: max(16px, env(safe-area-inset-left));
    right: max(16px, env(safe-area-inset-right));
    bottom: max(16px, env(safe-area-inset-bottom));
    max-width: calc(100vw - (max(16px, env(safe-area-inset-left)) + max(16px, env(safe-area-inset-right))));
    width: calc(100vw - (max(16px, env(safe-area-inset-left)) + max(16px, env(safe-area-inset-right))));
  }
}
/* Prevent accidental overflow from inner text */
.gt-sticky-quiz{ white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }

/* --- Mobile typography & overflow improvements --- */
:root{
  --body-line: 1.7;
}
/* Improve readability in main content */
.gt-main p,
.gt-main li{
  line-height: var(--body-line);
}
.gt-main p{ margin: 0 0 1rem; }
/* Prevent awkward long-word overflow */
.gt-main{ word-break: break-word; overflow-wrap: anywhere; hyphens: auto; }
/* Sup/sub tweaks so citations like (1) don't collide with next line */
sup, sub{ font-size: 0.75em; line-height: 0; }
/* Ensure body never scrolls sideways */
html, body{ max-width:100%; overflow-x:hidden; }

/* Harden sticky quiz CTA further to avoid horizontal overflow */
.gt-sticky-quiz{
  position: fixed;
  z-index: 999;
  left: 0;
  right: 0;
  bottom: 14px;
  width: auto;
  max-width: 680px;
  margin: 0 auto;
  box-sizing: border-box;
  padding-left: 16px;
  padding-right: 16px;
  transform: translateZ(0);
  will-change: transform;
}
@media (max-width: 640px){
  .gt-sticky-quiz{
    max-width: none;
    width: calc(100vw - 32px);
  }
}
@supports (left: max(0px)){
  .gt-sticky-quiz{
    bottom: max(14px, env(safe-area-inset-bottom));
  }
}

/* --- Mobile readability + gutters + sticky size --- */
:root{ --body-line: 1.8; }

/* Increase line-height and spacing */
.gt-main p, .gt-main li{ line-height: var(--body-line); }
.gt-main p{ margin: 0 0 1.1rem; }

/* Prevent word collisions */
.gt-main{ word-break: break-word; overflow-wrap: anywhere; hyphens: auto; }

/* Add white gutters on mobile so text never hugs the edge */
@media (max-width:640px){
  .gt-main .gt-container{
    background:#fff;
    margin-left:8px; margin-right:8px;
    padding-left:18px; padding-right:18px;
    border-radius:12px;
  }
}

/* Smaller sticky quiz CTA so it never sticks out */
.gt-sticky-quiz{
  font-size:14px;
  line-height:1.2;
  padding:10px 14px;
  border-radius:12px;
  max-width:580px;
}
@media (max-width:640px){
  .gt-sticky-quiz{
    font-size:13px;
    padding:10px 12px;
    width:calc(100vw - 36px);
    max-width:none;
    left:18px; right:18px;
  }
}

/* Hard clamp to remove horizontal scroll entirely */
html, body{ max-width:100%; overflow-x:hidden }

/* --- Symmetric gutters for posts/pages + homepage overflow clamp --- */
/* Symmetric white gutters on content pages */
@media (max-width:640px){
  body.single .gt-main > .gt-container,
  body.page .gt-main > .gt-container{
    background:#fff;
    padding-inline:18px !important;
    margin-inline:8px !important;
    border-radius:12px;
    box-sizing:border-box;
  }
}

/* Homepage: hard clamp horizontal overflow and add internal padding */
body.home, body.home .gt-main{ max-width:100%; overflow-x:hidden }
@media (max-width:640px){
  body.home .gt-hero,
  body.home .gt-hero-inner,
  body.home .gt-facts,
  body.home .gt-posts{ width:100%; overflow-x:hidden }
  body.home .gt-facts-grid,
  body.home .gt-post-grid{
    padding-inline:16px;
    width:100%;
    box-sizing:border-box;
    overflow-x:hidden;
    margin-left:auto; margin-right:auto;
  }
  body.home .gt-main > .gt-container{ padding-inline:16px; }
  body.home img{ max-width:100%; height:auto; display:block }
}

/* Sticky CTA: even smaller on mobile to avoid sticking out */
@media (max-width:640px){
  .gt-sticky-quiz{
    font-size:12px;
    padding:9px 12px;
    border-radius:10px;
    left:20px; right:20px;
    width:calc(100vw - 40px);
    max-width:none;
  }
}

/* Desktop single post content width */
@media (min-width:1025px){
  body.single .gt-main > .gt-container{
    max-width:800px;
    margin-left:auto;
    margin-right:auto;
  }
}

/* Single post header (title + meta) */
.gt-article-header{margin: 0 0 1rem}
.gt-title{margin: 0 0 .5rem; font-size: clamp(1.75rem, 2.2vw, 2.25rem); line-height:1.2}
.gt-meta{color: var(--muted); font-size: .95rem; margin: 0 0 1.25rem}
.gt-meta a{color: inherit}
.gt-content > * + *{margin-top: 1rem}

/* Meta styling: blue color; author linked & underlined */
:root{ --meta-blue:#2563eb; } /* Accessible blue */
body.single .gt-meta time{ color:var(--meta-blue); }
body.single .gt-meta .gt-author a{ color:var(--meta-blue); text-decoration:underline; }
body.single .gt-meta .gt-author a:hover{ text-decoration:underline; }
/* Keep the separator dot subtle */
.gt-meta{ color: var(--muted); }

/* --- Footer mobile fixes --- */
@media (max-width: 1024px){
  .gt-footer-grid{ grid-template-columns: 1fr 1fr; }
  .gt-newsletter-inner{ grid-template-columns: 1fr; }
}
@media (max-width: 640px){
  .gt-footer-grid{ grid-template-columns: 1fr; }
  .gt-newsletter{ flex-direction: column; gap: 10px; }
  .gt-newsletter input{ min-width: 0; width: 100%; }
  .gt-newsletter .gt-btn{ width: 100%; text-align: center; }
}
/* Prevent any footer content from causing horizontal scroll */
/* removed overly broad footer max-width rule */

/* --- Footer container alignment fix (desktop) --- */
.gt-footer .gt-container{
  max-width:1200px !important;
  margin-left:auto !important;
  margin-right:auto !important;
  padding-left:24px; padding-right:24px;
  box-sizing:border-box;
}
/* Ensure children wrap safely without stretching container */
.gt-footer img{ max-width:100%; height:auto; display:block }
.gt-footer .gt-newsletter-inner{ width:100%; box-sizing:border-box }

/* Keep mobile stacking rules (no overlap) */
@media (max-width:1024px){
  .gt-footer-grid{ grid-template-columns:1fr 1fr; }
}
@media (max-width:640px){
  .gt-footer-grid{ grid-template-columns:1fr; }
  .gt-newsletter{ flex-direction:column; gap:10px; }
  .gt-newsletter input{ min-width:0; width:100%; }
  .gt-newsletter .gt-btn{ width:100%; text-align:center; }
}
