/* GoldenWebb polish, November 2026.
   Loaded after style.css. Same black-and-white site, with tidier cards,
   type and spacing and a small gold accent. Remove the <link> to this file
   in layouts/default.htm to go back to the previous look. */

:root {
  --gw-gold: #c9a227;
  --gw-ink: #16181b;
  --gw-line: #e4e5e7;
  --gw-muted: #5c6168;
  --gw-radius: 14px;
  --gw-shadow: 0 1px 2px rgba(0, 0, 0, .06), 0 10px 28px rgba(0, 0, 0, .08);
}

body { color: var(--gw-ink); -webkit-font-smoothing: antialiased; }
::selection { background: var(--gw-gold); color: #000; }

/* ---------- header ---------- */
#header { background: rgba(18, 20, 23, .94) !important; backdrop-filter: blur(8px); border-bottom: 1px solid rgba(255, 255, 255, .08); }
@media (min-width: 992px) {
  #navbar > ul > li > a.nav-link { position: relative; letter-spacing: .02em; transition: color .2s; }
  #navbar > ul > li > a.nav-link::after { content: ""; position: absolute; left: 0; right: 0; bottom: -6px; height: 2px; background: var(--gw-gold); transform: scaleX(0); transform-origin: left; transition: transform .25s ease; }
  #navbar > ul > li > a.nav-link:hover { color: #fff !important; }
  #navbar > ul > li > a.nav-link:hover::after { transform: scaleX(1); }
}

/* ---------- home hero ---------- */
#hero1 { position: relative; border-bottom: 0 !important; background-position: center top !important; }
#hero1::after { content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: 4px; background: linear-gradient(90deg, var(--gw-gold), #f0d77a 50%, var(--gw-gold)); }

/* ---------- section headings ---------- */
#main > .container-fluid, .bg-section { max-width: 1240px; margin-left: auto; margin-right: auto; }
@media (max-width: 767px) { #main > .container-fluid { padding-left: 1.1rem !important; padding-right: 1.1rem !important; } }
h1.display-5, h2.display-5 { font-size: clamp(1.7rem, 1.2rem + 1.6vw, 2.35rem); letter-spacing: -.01em; margin-bottom: 1.1rem; }
h1.display-5.text-body-emphasis::after, h2.display-5::after,
.section-title h2::after { content: ""; display: block; width: 56px; height: 4px; border-radius: 2px; background: var(--gw-gold); margin-top: .55rem; }
.section-title h2::before { display: none !important; }
.section-title h2::after { position: static !important; margin: .6rem auto 0; }
.section-title h2 { padding-bottom: 0 !important; letter-spacing: .04em; }

/* ---------- review cards ---------- */
.blog-post.zoom-effect { transition: none; margin-top: .75rem !important; margin-bottom: .75rem !important; }
.blog-post.zoom-effect:hover { transform: none; }
.blog-post > a { display: block; height: 100%; }
.blog-post > a > div { border: 1px solid var(--gw-line) !important; border-radius: var(--gw-radius) !important; box-shadow: var(--gw-shadow) !important; padding: 0 0 1.15rem !important; overflow: hidden; transition: transform .25s ease, box-shadow .25s ease, border-color .25s ease; }
.blog-post > a:hover > div { transform: translateY(-5px); box-shadow: 0 2px 4px rgba(0, 0, 0, .08), 0 18px 40px rgba(0, 0, 0, .14) !important; border-color: #cfd1d4 !important; }
.blog-post img.thumbnail { display: block; width: 100%; aspect-ratio: 16 / 9; object-fit: cover; border-radius: 0; transition: transform .5s ease; }
.blog-post > a:hover img.thumbnail { transform: scale(1.04); }
.blog-post h5.card-title { font-size: 1.45rem; line-height: 1.2; margin: 1.05rem 1.25rem .35rem !important; }
.blog-post .card-text { margin: 0 1.25rem; color: var(--gw-muted); font-size: .95rem; }
.blog-post .card-text::after { content: "Read the review \2192"; display: block; margin-top: .8rem; font-weight: 600; font-size: .85rem; letter-spacing: .03em; color: var(--gw-ink); }
.blog-post > a:hover .card-text::after { color: #8a6d10; }

/* ---------- buttons ---------- */
.btn.btn-dark, #footer .footer-newsletter form input[type="submit"], .contact .php-email-form button[type="submit"], .contact button[type="submit"] {
  background: var(--gw-ink); border: 1px solid var(--gw-ink); border-radius: 999px; padding: .65rem 1.5rem; font-weight: 600; letter-spacing: .01em; transition: background .2s, color .2s, border-color .2s, transform .2s; }
.btn.btn-dark:hover, #footer .footer-newsletter form input[type="submit"]:hover, .contact button[type="submit"]:hover { background: var(--gw-gold); border-color: var(--gw-gold); color: #000 !important; }
.btn.btn-dark:hover a { color: #000 !important; }
.btn.btn-dark a { display: inline-flex; align-items: center; gap: .4rem; }
.btn.btn-dark.btn-lg { font-size: 1rem; }

/* ---------- reviews list ---------- */
.bg-section .col-md-9 > div { border: 1px solid var(--gw-line) !important; border-radius: var(--gw-radius) !important; box-shadow: var(--gw-shadow) !important; padding: .6rem 1.4rem !important; }
.post-list li { border-bottom: 1px solid var(--gw-line) !important; margin: 0 !important; padding: 1.05rem .2rem; transition: background .2s; }
.post-list li:last-child { border-bottom: 0 !important; }
.post-list li h3 { font-size: 1.3rem; font-weight: 700; margin-bottom: .2rem; }
.post-list li h3 a { color: var(--gw-ink); background-image: linear-gradient(var(--gw-gold), var(--gw-gold)); background-size: 0 2px; background-repeat: no-repeat; background-position: 0 100%; transition: background-size .25s; }
.post-list li:hover h3 a { background-size: 100% 2px; }
.post-list p.info { color: var(--gw-muted); font-size: .8rem; text-transform: uppercase; letter-spacing: .06em; margin-bottom: .35rem; }
.post-list p.excerpt { color: #3c4046; margin-bottom: 0; }
.pagination { gap: .35rem; margin-top: 1rem; }
.pagination li { background: #eef0f2 !important; border-radius: 10px !important; padding: .45rem .9rem !important; font-size: 1rem !important; margin: 0 !important; }
.pagination li a { color: var(--gw-ink) !important; }
.pagination li.active, .pagination .active a { background: var(--gw-ink) !important; color: #fff !important; }
.bg-section .col-md-3 h2 { font-size: 1.05rem; text-transform: uppercase; letter-spacing: .08em; color: var(--gw-muted); margin-bottom: .7rem; }
.bg-section .col-md-3 ul li a { color: var(--gw-ink); font-weight: 600; }
.bg-section .col-md-3 ul li a:hover { color: #8a6d10; }

/* ---------- a review ---------- */
.container[style*="980px"] > h1.display-5 { border-bottom: 0 !important; padding-top: .6rem; }
.container[style*="980px"] > h1.display-5::after { content: ""; display: block; width: 56px; height: 4px; border-radius: 2px; background: var(--gw-gold); margin-top: .55rem; }
#video-holder iframe, .about iframe { border-radius: var(--gw-radius); box-shadow: var(--gw-shadow); }
.container[style*="980px"] p { font-size: 1.04rem; line-height: 1.75; color: #2b2f34; }
.container[style*="980px"] p.info { font-size: .8rem; text-transform: uppercase; letter-spacing: .06em; color: var(--gw-muted); }

/* ---------- about ---------- */
.about .content p { font-size: 1.04rem; line-height: 1.75; }
.about iframe { width: 100%; height: auto; aspect-ratio: 16 / 9; }
.clients img { filter: grayscale(1); opacity: .8; transition: filter .25s, opacity .25s, transform .25s; }
.clients a:hover img { filter: none; opacity: 1; transform: translateY(-3px); }

/* ---------- contact ---------- */
.contact .info, .contact .php-email-form, .contact form { border-top: 3px solid var(--gw-gold) !important; border-bottom: 0 !important; border-radius: var(--gw-radius); box-shadow: var(--gw-shadow) !important; }
.contact .info i { color: var(--gw-ink) !important; background: #f1f2f4 !important; }
.contact .info .address:hover i, .contact .info .email:hover i { background: var(--gw-gold) !important; color: #000 !important; }
.contact form input, .contact form textarea { border-radius: 10px !important; border-color: var(--gw-line); }
.contact form input:focus, .contact form textarea:focus { border-color: var(--gw-gold) !important; box-shadow: 0 0 0 3px rgba(201, 162, 39, .18) !important; }

/* ---------- newsletter and footer ---------- */
#footer .footer-newsletter { background: #f4f5f6; border-top: 1px solid var(--gw-line); padding: 56px 0; }
#footer .footer-newsletter h4 { font-size: 1.6rem; font-weight: 700; }
#footer .footer-newsletter form { box-shadow: var(--gw-shadow); border: 1px solid var(--gw-line); }
#footer .footer-top .footer-links ul a:hover { color: #8a6d10; }
#footer .footer-top .footer-links ul i { color: var(--gw-gold); }
#footer .footer-top .social-links a { background: var(--gw-ink); transition: background .2s, color .2s, transform .2s; }
#footer .footer-top .social-links a:hover { background: var(--gw-gold); color: #000; transform: translateY(-2px); }
#footer .footer-bottom { max-width: none; padding-left: max(1rem, calc((100% - 1296px) / 2)); padding-right: max(1rem, calc((100% - 1296px) / 2)); }
.back-to-top { background: var(--gw-ink); border-radius: 50%; }
.back-to-top:hover { background: var(--gw-gold); }
.back-to-top:hover i { color: #000; }
