* { box-sizing: border-box; margin: 0; padding: 0; }
html { width:100%; overflow-x:hidden; -webkit-text-size-adjust:100%; }
html, body { font-family: 'Segoe UI', Tahoma, Verdana, sans-serif; background:#87CEEB; color:#222; line-height:1.5; min-width:0; }
body { width:100%; overflow-x:hidden; }
a { text-decoration:none; color:inherit; }
img { max-width:100%; height:auto; display:block; }
button, input, select, textarea { font:inherit; max-width:100%; }

/* HEADER */
.site-header { min-height:200px; background:#004d4d; color:#f5f5f5; display:flex; flex-direction:column; justify-content:space-between; padding:10px 24px; }
.header-line-1 { font-size:clamp(1.05rem, 2.4vw, 1.6rem); font-weight:700; text-align:center; letter-spacing:1px; }
.header-line-2 { display:flex; align-items:center; justify-content:center; gap:12px; min-width:0; text-align:center; }
.header-line-2 .logo { height:44px; width:auto; }
.header-line-2 .brand { font-size:clamp(1.35rem, 4vw, 2rem); font-weight:800; letter-spacing:2px; overflow-wrap:anywhere; }
.site-nav { width:100%; }
.site-nav ul { list-style:none; display:flex; justify-content:center; flex-wrap:wrap; gap:6px; max-width:1400px; margin:0 auto; }
.site-nav li { min-width:0; }
.site-nav a { display:inline-flex; align-items:center; justify-content:center; padding:8px 14px; font-size:0.95rem; font-weight:600; border-radius:4px; transition:background .2s; color:#fff; text-align:center; line-height:1.25; }
.site-nav a:hover { background:#00332f; }

/* HERO */
.hero { background:#87CEEB; padding:clamp(16px, 3vw, 24px) 16px 12px; text-align:center; }
.hero h2 { font-size:clamp(1.25rem, 3vw, 1.7rem); color:#003b4a; margin-bottom:16px; overflow-wrap:balance; }
.ad-slot { width:100%; max-width:min(970px, 100%); height:clamp(120px, 26vw, 250px); margin:0 auto; background:#e6f4fa; border:2px dashed #0077a3; display:flex; align-items:center; justify-content:center; color:#0077a3; font-weight:600; text-align:center; padding:10px; }

/* CALCULATOR GRID */
main.body { padding:24px 16px; background:#87CEEB; min-height:60vh; width:100%; }
.calc-grid { display:grid; grid-template-columns:repeat(5, minmax(0, 1fr)); gap:16px; max-width:1400px; width:100%; margin:0 auto; }
.calc-card { background:#FF8C00; border:3px solid #003366; border-radius:8px; padding:18px 12px; text-align:center; color:#fff; font-weight:700; font-size:1rem; box-shadow:0 3px 6px rgba(0,0,0,.2); transition:transform .18s, background .2s; min-height:80px; display:flex; align-items:center; justify-content:center; min-width:0; overflow-wrap:anywhere; }
.calc-card:hover { transform:translateY(-3px); background:#e67a00; }

/* Pagination */
.pagination { display:flex; justify-content:center; gap:8px; margin:28px auto; flex-wrap:wrap; max-width:1400px; padding:0 8px; }
.pagination a, .pagination span { background:#003366; color:#fff; padding:10px 16px; border-radius:4px; font-weight:600; min-width:44px; text-align:center; }
.pagination .active { background:#FF8C00; }
.pagination .pg-nav { background:#004d4d; }
.pagination .pg-nav:hover { background:#006666; }

/* Testimonials */
.testimonials { background:#f0f9ff; padding:36px 0; overflow:hidden; border-top:4px solid #004d4d; }
.testimonials h2 { text-align:center; margin-bottom:24px; color:#003b4a; font-size:1.8rem; }
.marquee { overflow:hidden; position:relative; width:100%; }
.marquee-track { display:flex; gap:20px; width:max-content; animation:scroll-left 240s linear infinite; padding:12px; }
.testimonial-card { flex:0 0 clamp(240px, 78vw, 300px); background:#fff; border-left:5px solid #FF8C00; padding:18px; border-radius:6px; box-shadow:0 3px 8px rgba(0,0,0,.08); }
.testimonial-card p { font-style:italic; color:#333; margin-bottom:10px; font-size:0.95rem; }
.testimonial-card .who { font-weight:700; color:#004d4d; font-size:0.9rem; }
@keyframes scroll-left { from { transform:translateX(0); } to { transform:translateX(-50%); } }
.marquee:hover .marquee-track { animation-play-state:paused; }

/* FOOTER */
.site-footer { background:#5b0000; color:#fff; padding:36px 20px 0; margin-top:0; }
.footer-cols { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:32px; max-width:1400px; margin:0 auto; }
.footer-col h3 { color:#ffcc80; margin-bottom:14px; font-size:1.1rem; letter-spacing:1px; }
.footer-col ul { list-style:none; }
.footer-col li { margin-bottom:8px; }
.footer-col a { color:#fff; }
.footer-col a:hover { text-decoration:underline; color:#ffcc80; }
.footer-col p { color:#f5e6e6; font-size:0.95rem; }
.hidden-links { display:none; }
.copyright { text-align:center; margin-top:30px; padding:14px; background:#003300; color:#fff; font-size:14px; font-weight:600; }

/* Content pages */
.content-page { width:min(calc(100% - 32px), 960px); margin:30px auto; background:#fff; padding:30px 34px; border-radius:8px; box-shadow:0 4px 12px rgba(0,0,0,.08); overflow-wrap:anywhere; }
.content-page h1 { color:#004d4d; margin-bottom:16px; font-size:clamp(1.4rem, 4vw, 2rem); text-align:center; line-height:1.2; }
.content-page h2 { color:#003366; margin:20px 0 10px; font-size:clamp(1.1rem, 3vw, 1.35rem); text-align:left; line-height:1.25; }
.content-page h3 { text-align:left; }
.content-page p, .content-page li { margin-bottom:10px; color:#333; }
.content-page ul { padding-left:22px; }

/* Calculator tool page */
.tool-page { width:min(calc(100% - 32px), 820px); margin:30px auto; background:#fff; padding:28px; border-radius:8px; box-shadow:0 4px 12px rgba(0,0,0,.1); overflow-wrap:anywhere; }
.tool-page h1 { color:#004d4d; text-align:center; margin-bottom:8px; font-size:clamp(1.45rem, 4vw, 2rem); line-height:1.2; }
.tool-page .subtitle { text-align:center; color:#0077a3; margin-bottom:22px; }
.tool-form { display:flex; flex-direction:column; gap:14px; margin:20px 0; }
.tool-form label { display:flex; flex-direction:column; gap:6px; font-weight:600; color:#003366; min-width:0; }
.tool-form input, .tool-form select, .tool-form textarea { width:100%; padding:10px 12px; border:2px solid #003366; border-radius:5px; font-size:1rem; min-width:0; }
.tool-form button { background:#FF8C00; color:#fff; border:none; padding:12px 20px; font-weight:700; font-size:1rem; border-radius:5px; cursor:pointer; }
.tool-form button:hover { background:#e67a00; }
.tool-result { background:#f0f9ff; border-left:5px solid #004d4d; padding:16px; border-radius:5px; font-weight:600; color:#003b4a; min-height:52px; overflow-wrap:anywhere; }
.back-link { display:inline-block; margin-top:20px; color:#004d4d; font-weight:600; }
.back-link:hover { text-decoration:underline; }

.tool-form .btn-row { display:flex; gap:12px; background:#FF8C00; padding:10px; border-radius:8px; }
.tool-form .btn-row .btn-calc, .tool-form .btn-row .btn-reset { flex:1; background:#FF8C00; color:#fff; border:2px solid #fff; padding:12px 20px; font-weight:800; font-size:1rem; border-radius:6px; cursor:pointer; margin:0; }
.tool-form .btn-row .btn-calc:hover, .tool-form .btn-row .btn-reset:hover { background:#e67a00; }
.tool-result .err { color:#b91c1c; font-weight:600; }

/* Category headings on listing pages */
.cat-heading { text-align:center; color:#000; font-size:2rem; font-weight:800; margin:36px auto 18px; max-width:1400px; padding:10px 16px; border-bottom:3px solid #003366; letter-spacing:0.5px; line-height:1.2; overflow-wrap:anywhere; }
.cat-heading:first-of-type { margin-top:8px; }
.calc-card { flex-direction:column; gap:6px; }
.calc-card .calc-name { font-size:1rem; font-weight:700; line-height:1.2; min-width:0; overflow-wrap:anywhere; }
.calc-card .calc-cat { font-size:0.72rem; font-weight:500; color:#ffe4c4; text-transform:uppercase; letter-spacing:0.5px; opacity:0.9; }

/* Contact page */
.contact-form { max-width:560px; width:100%; margin:20px auto; }
.contact-fields label { display:flex; flex-direction:column; font-weight:600; color:#003366; gap:6px; }
.contact-fields textarea { width:100%; padding:10px 12px; border:2px solid #003366; border-radius:5px; font-size:1rem; font-family:inherit; resize:vertical; min-width:0; }
.contact-info { max-width:560px; margin:16px auto; background:#f0f9ff; border-left:5px solid #004d4d; padding:16px 20px; border-radius:6px; }
.contact-info p { margin:6px 0; }

.about-calc { max-width:100%; }
.about-calc h2 { font-size:clamp(1.25rem, 4vw, 1.6rem) !important; line-height:1.25 !important; }
.about-calc p { overflow-wrap:anywhere; }
.about-calc a { max-width:100%; white-space:normal; text-align:center; }

/* Responsive */
@media (max-width: 1200px) {
  .calc-grid { grid-template-columns:repeat(4, minmax(0, 1fr)); }
}

@media (max-width: 1000px) {
  .footer-cols { grid-template-columns:repeat(2,minmax(0,1fr)); gap:24px; }
}

@media (max-width: 900px) {
  .calc-grid { grid-template-columns:repeat(3, minmax(0, 1fr)); }
  .site-header { min-height:0; padding:12px 14px; gap:10px; }
  .header-line-1 { letter-spacing:.5px; }
  .header-line-2 .brand { letter-spacing:1px; }
  .header-line-2 .logo { height:36px; }
  .site-nav ul { gap:4px; }
  .site-nav a { padding:7px 10px; font-size:.85rem; }
  .content-page { width:min(calc(100% - 24px), 960px); margin:20px auto; padding:22px 18px; }
  .tool-page { width:min(calc(100% - 24px), 820px); margin:20px auto; padding:20px 16px; }
  .cat-heading { font-size:1.5rem; margin:28px auto 14px; }
  .testimonials h2 { font-size:1.4rem; }
  main.body { padding:18px 10px; }
}

@media (max-width: 700px) {
  .site-nav ul { display:grid; grid-template-columns:repeat(2, minmax(0, 1fr)); gap:6px; }
  .site-nav a { width:100%; min-height:38px; background:rgba(255,255,255,.08); }
}

@media (max-width: 600px) {
  .calc-grid { grid-template-columns:repeat(2, minmax(0, 1fr)); gap:12px; }
  .footer-cols { grid-template-columns:1fr; gap:20px; }
  .ad-slot { height:120px; font-size:.85rem; }
  .header-line-1 { font-size:.95rem; }
  .header-line-2 { gap:8px; }
  .header-line-2 .brand { font-size:1.15rem; }
  .site-nav a { padding:6px 8px; font-size:.78rem; }
  .content-page { width:min(calc(100% - 16px), 960px); margin:14px auto; padding:18px 14px; border-radius:6px; }
  .tool-page { width:min(calc(100% - 16px), 820px); margin:14px auto; padding:16px 12px; }
  .tool-form input, .tool-form select, .tool-form textarea, .contact-fields textarea { font-size:16px; } /* prevent iOS zoom */
  .tool-form .btn-row { flex-direction:column; padding:8px; gap:8px; }
  .pagination { gap:6px; margin:22px auto; }
  .pagination a, .pagination span { padding:8px 10px; font-size:.9rem; }
  .cat-heading { font-size:1.25rem; padding:8px 10px; }
  .hero h2 { font-size:1.3rem; }
  .testimonial-card { padding:14px; }
  .marquee { overflow:visible; }
  .marquee-track { width:100%; display:grid; grid-template-columns:1fr; gap:12px; transform:none !important; animation:none !important; padding:0 14px; }
  .marquee-track .testimonial-card { width:100%; max-width:100%; flex:initial; }
  .marquee-track .testimonial-card:nth-child(n+4) { display:none; }
  .copyright { font-size:12px; padding:12px 8px; }
  .site-footer { padding:24px 14px 0; }
  .about-calc { padding:18px 0 0 !important; }
  .about-calc p { text-align:left !important; }
}

@media (max-width: 420px) {
  main.body { padding:14px 8px; }
  .calc-grid { grid-template-columns:1fr; }
  .header-line-2 .logo { height:32px; }
  .site-nav ul { grid-template-columns:repeat(2, minmax(0, 1fr)); }
  .calc-card { min-height:68px; padding:14px 10px; }
  .calc-card .calc-name { font-size:.95rem; }
  .calc-card .calc-cat { font-size:.68rem; }
}

@media (max-width: 330px) {
  .site-nav a { font-size:.74rem; }
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { scroll-behavior:auto !important; animation-duration:.01ms !important; animation-iteration-count:1 !important; transition-duration:.01ms !important; }
}

/* Loading state */
.mc-loading{display:inline-flex;align-items:center;gap:8px;color:#555;font-style:italic}
.mc-spinner{width:16px;height:16px;border:2px solid #ddd;border-top-color:#0a66c2;border-radius:50%;display:inline-block;animation:mc-spin .7s linear infinite}
@keyframes mc-spin{to{transform:rotate(360deg)}}
@media (prefers-reduced-motion: reduce){ .mc-spinner{animation:none} }