/*
Theme Name: Gul Khan Corporate
Theme URI: https://gulkhancorporate.com
Description: Custom homepage theme for Gul Khan Corporate — corporate giveaways & branded gifts.
Author: Gul Khan Corporate
Version: 1.1.0
License: GPL-2.0-or-later
Text Domain: gulkhan
*/
/* ============================================================
THEME TOKENS
Default = The Good Road palette.
Gul Khan ke apne brand colours chahiye to neeche
commented values ko swap kar do.
============================================================ */
:root{
--blush:#F1DCD3; /* Gul Khan cream: #F8EED8 */
--red:#D31B29; /* Gul Khan rust: #CA3511 */
--teal:#05514D; /* Gul Khan dark: #2F2E2E */
--gold:linear-gradient(45deg,rgb(252,195,4),rgba(251,192,5,.68));
--ink:#1c1c1c;
--font-body:'Oswald',sans-serif;
--font-head:"Iowan Old Style","Apple Garamond",Baskerville,"Times New Roman",Georgia,serif;
--maxw:1200px;
--gap:20px;
--btn-radius:8px; /* buttons */
--card-radius:14px; /* cards, tiles, review boxes */
--panel-radius:20px; /* big panels */
}
*{margin:0;padding:0;box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{
background:var(--blush);
color:var(--ink);
font-family:var(--font-body);
font-weight:300;
-webkit-font-smoothing:antialiased;
}
img{max-width:100%;display:block;}
a{text-decoration:none;color:inherit;}
.wrap{max-width:var(--maxw);margin:0 auto;padding:0 24px;}
/* har image ke liye — cover fit */
.img{width:100%;height:100%;object-fit:cover;}
.ph{background:#e2c9bf;display:flex;align-items:center;justify-content:center;
color:#9a7261;font-size:11px;letter-spacing:2px;text-transform:uppercase;
width:100%;height:100%;}
/* ============================================================
1. TOP SCROLLING MARQUEE
============================================================ */
.marquee{--speed:28s;--mgap:55px;background:var(--red);overflow:hidden;width:100%;padding:11px 0;}
.marquee__track{display:flex;width:max-content;animation:scrollX var(--speed) linear infinite;}
.marquee__group{display:flex;align-items:center;gap:var(--mgap);padding-right:var(--mgap);}
.marquee__group span{color:#fff;font-size:15px;font-weight:500;white-space:nowrap;
text-transform:uppercase;letter-spacing:.4px;}
@keyframes scrollX{from{transform:translateX(0)}to{transform:translateX(-50%)}}
.marquee:hover .marquee__track{animation-play-state:paused}
/* ============================================================
2. ANNOUNCEMENT BAR
============================================================ */
.announce{background:var(--red);text-align:center;padding:14px 28px;}
.announce__inner{display:inline-flex;align-items:center;justify-content:center;
gap:18px;flex-wrap:wrap;}
.announce__main{font-family:var(--font-head);color:#fff;font-size:20px;
font-weight:400;letter-spacing:.3px;}
.announce__dot{width:5px;height:5px;border-radius:50%;background:#FCC304;flex:0 0 auto;}
.announce__sub{font-size:13px;font-weight:300;color:#FCC304;letter-spacing:.5px;}
.announce__sub a{border-bottom:1px solid rgba(252,195,4,.45);padding-bottom:2px;
transition:border-color .2s;}
.announce__sub a:hover{border-bottom-color:#FCC304;}
/* ============================================================
3. HEADER + NAV
============================================================ */
.header{background:var(--blush);padding:16px 0 0;}
.header__bar{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:16px;}
.header__left,.header__right{display:flex;align-items:center;gap:22px;}
.header__right{justify-content:flex-end;}
.header__icon{display:flex;align-items:center;gap:7px;font-size:13px;
text-transform:uppercase;letter-spacing:1px;color:var(--red);cursor:pointer;}
.header__icon svg{width:19px;height:19px;stroke:var(--red);fill:none;stroke-width:1.6;}
.logo img{height:94px;width:auto;margin:0 auto;}
.nav ul,.nav li{display:contents;list-style:none;}
/* the Shop item hosts the mega panel, so it needs a real box */
.nav li.has-mega{display:flex;align-items:center;position:static;}
.nav{display:flex;justify-content:center;flex-wrap:wrap;gap:30px;padding:20px 0 18px;}
.nav a{font-size:15px;letter-spacing:.4px;color:var(--teal);
display:flex;align-items:center;gap:6px;padding:5px 0;
border-bottom:1px solid transparent;transition:border-color .2s;}
.nav a:hover{border-bottom-color:var(--teal);}
.nav .caret{width:9px;height:9px;border-right:1.5px solid var(--teal);
border-bottom:1.5px solid var(--teal);transform:rotate(45deg) translateY(-2px);}
/* ============================================================
4. HERO
============================================================ */
/* --hero-gap ek hi jagah se: left, right, top, bottom aur videos ke beech — sab equal */
.hero{--hero-gap:8px;display:grid;grid-template-columns:repeat(3,1fr);
gap:var(--hero-gap);padding:var(--hero-gap);background:var(--blush);}
/* height fix rakhi hai, aspect-ratio nahi — warna max-height cell ki width
ghata deta hai aur videos ke beech bada gap ban jaata hai */
.hero__cell{position:relative;height:clamp(380px,46vw,760px);overflow:hidden;}
.hero__cell video,.hero__cell img{width:100%;height:100%;object-fit:cover;display:block;}
.hero__overlay{position:absolute;inset:0;display:flex;flex-direction:column;
align-items:center;justify-content:center;text-align:center;
background:rgba(0,0,0,.28);color:#fff;padding:0 18px;}
.hero__title{font-family:var(--font-head);font-size:38px;font-weight:400;line-height:1.15;}
.hero__sub{font-size:13px;letter-spacing:3px;text-transform:uppercase;margin-top:10px;font-weight:300;}
.btn{display:inline-block;margin-top:26px;padding:13px 40px;
border:1px solid #fff;color:#fff;background:transparent;border-radius:var(--btn-radius);
font-size:13px;letter-spacing:2.5px;text-transform:uppercase;font-weight:400;
cursor:pointer;transition:.25s;}
.btn:hover{background:#fff;color:var(--teal);}
.btn--dark{border-color:var(--red);color:var(--red);}
.btn--dark:hover{background:var(--red);color:#fff;}
/* solid red button — asli site jaisa */
.btn--solid{background:var(--red);border-color:var(--red);color:var(--blush);
border-radius:var(--btn-radius);padding:17px 38px;font-size:17px;letter-spacing:.5px;}
.btn--solid:hover{background:#a81420;border-color:#a81420;color:var(--blush);}
/* ============================================================
5. TRUSTED BY
============================================================ */
.trusted{padding:52px 0 44px;text-align:center;}
.trusted h2{font-family:var(--font-head);color:var(--teal);font-size:42px;
font-weight:400;line-height:1.15;margin-bottom:38px;}
.logos{overflow:hidden;}
.logos__track{display:flex;width:max-content;animation:scrollX 32s linear infinite;}
.logos__group{display:flex;align-items:center;gap:56px;padding-right:56px;}
.logos__group .ph{width:110px;height:52px;flex:0 0 auto;font-size:10px;}
/* ============================================================
6. POPULAR PRODUCTS — MASONRY
============================================================ */
.section{padding:60px 0;}
.section__head{text-align:center;margin-bottom:40px;}
.section__head h2{font-family:var(--font-head);color:var(--teal);
font-size:42px;font-weight:400;line-height:1.15;}
.section__head p{color:var(--teal);font-size:15px;margin-top:12px;
font-weight:300;letter-spacing:.3px;}
.masonry{display:grid;grid-template-columns:repeat(4,1fr);
grid-auto-rows:170px;grid-auto-flow:dense;gap:var(--gap);}
.card{position:relative;overflow:hidden;border-radius:var(--card-radius);}
.card .img{transition:transform .6s ease;}
.card:hover .img{transform:scale(1.06);}
.card__cap{position:absolute;left:0;right:0;bottom:0;padding:22px 18px;color:#fff;
text-shadow:0 1px 3px rgba(0,0,0,.45);
background:linear-gradient(to top,rgba(0,0,0,.80) 0%,rgba(0,0,0,.46) 42%,transparent 82%);}
.card__cap b{display:block;font-size:15px;font-weight:500;letter-spacing:.5px;line-height:1.3;}
.card__cap span{display:block;font-size:12px;font-weight:300;opacity:.9;margin-top:3px;}
.s1{grid-row:span 1}.s2{grid-row:span 2}.s3{grid-row:span 3}
/* ============================================================
7. USP BANNER
============================================================ */
.usp{background:var(--red);color:#fff;padding:42px 0;}
.usp__grid{display:grid;grid-template-columns:repeat(4,1fr);gap:24px;text-align:center;}
.usp__item{font-family:var(--font-head);font-size:18px;letter-spacing:.2px;
text-transform:none;font-weight:400;
display:flex;flex-direction:column;align-items:center;gap:16px;}
.usp__item svg{width:32px;height:32px;stroke:#fff;fill:none;stroke-width:1.2;}
/* ============================================================
8. MEDIA WITH TEXT
============================================================ */
/* more room under the section so it does not crowd the block below */
.promo{background:var(--blush);padding:44px 0 76px;}
.promo__wrap{position:relative;max-width:var(--maxw);margin:0 auto;padding:0 24px;}
.promo__media{width:74%;margin-left:auto;height:430px;overflow:hidden;
border-radius:var(--card-radius);}
.promo__media img{width:100%;height:100%;object-fit:cover;}
/* centred with auto margins, not translateY(-50%): the scroll-reveal animation
animates `transform`, and its end state (transform:none) would wipe out any
transform used for positioning */
.promo__card{position:absolute;left:24px;top:0;bottom:0;
margin-top:auto;margin-bottom:auto;height:-moz-fit-content;height:fit-content;
width:min(420px,42%);background:var(--red);color:#fff;
border-radius:var(--card-radius);padding:42px 38px;}
.promo__card h2{font-family:var(--font-head);font-size:31px;font-weight:400;
line-height:1.24;text-transform:uppercase;letter-spacing:.4px;}
.promo__card p{font-size:14px;line-height:1.75;font-weight:300;margin-top:18px;}
.promo__card .btn{border-color:#fff;color:#fff;margin-top:26px;}
.promo__card .btn:hover{background:#fff;color:var(--red);}
/* ============================================================
9. REVIEWS
============================================================ */
.reviews{padding:60px 0;overflow:hidden;}
.reviews h2{font-family:var(--font-head);color:var(--teal);font-size:36px;
font-weight:400;text-align:center;margin-bottom:36px;}
.reviews__track{display:flex;width:max-content;gap:20px;animation:scrollX 60s linear infinite;}
.reviews__track:hover{animation-play-state:paused}
.review{width:345px;flex:0 0 auto;background:var(--red);color:#fff;
padding:30px 28px;border-radius:var(--card-radius);}
.review p{font-size:14px;line-height:1.8;color:#fff;font-weight:300;}
.review b{display:block;margin-top:22px;font-family:var(--font-head);color:#fff;
font-size:15px;letter-spacing:1.4px;font-weight:400;}
.stars{color:#FCC304;font-size:15px;letter-spacing:3px;margin-bottom:14px;}
/* ============================================================
10. INSTAGRAM
============================================================ */
.insta{padding:50px 0 60px;text-align:center;}
.insta h2{font-family:var(--font-head);color:var(--teal);font-size:30px;font-weight:400;}
.insta a.handle{display:inline-block;margin-top:10px;font-size:12px;letter-spacing:3px;
text-transform:uppercase;color:var(--red);border-bottom:1px solid var(--red);padding-bottom:3px;}
.insta__grid{display:grid;grid-template-columns:repeat(4,1fr);gap:var(--gap);margin-top:30px;}
.insta__cell{aspect-ratio:1/1;overflow:hidden;}
/* ============================================================
11. NEED HELP / FAQ
============================================================ */
.help{background:var(--blush);padding:56px 0 64px;}
.help__box{background:var(--red);border-radius:14px;padding:48px 52px;
display:grid;grid-template-columns:1fr 1.15fr;gap:48px;align-items:start;}
.help__box h2{font-family:var(--font-head);color:#fff;font-size:52px;
font-weight:400;line-height:1;}
.help__lead{color:#FCC304;font-size:13px;margin:10px 0 30px;font-weight:400;line-height:1.5;}
.help__row{margin-bottom:20px;}
.help__row small{display:block;font-size:12px;letter-spacing:1.6px;color:#fff;
text-transform:uppercase;margin-bottom:2px;}
.help__row span{font-size:16px;color:#fff;font-weight:300;line-height:1.5;}
.faq{display:flex;flex-direction:column;gap:14px;}
.faq details{background:var(--blush);border-radius:10px;overflow:hidden;}
.faq summary{cursor:pointer;list-style:none;padding:18px 20px;
display:flex;align-items:center;gap:14px;
font-size:14px;color:var(--teal);font-weight:400;line-height:1.4;}
.faq summary::-webkit-details-marker{display:none}
.faq summary svg{width:24px;height:24px;flex:0 0 auto;
stroke:var(--teal);fill:none;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round;}
.faq summary .q{flex:1;}
.faq summary .plus{width:28px;height:28px;flex:0 0 auto;border-radius:50%;
border:1px solid rgba(5,81,77,.4);display:flex;align-items:center;justify-content:center;
font-size:17px;line-height:1;color:var(--teal);transition:background .2s;}
.faq summary:hover .plus{background:rgba(5,81,77,.09);}
.faq .plus::after{content:"+";}
.faq details[open] .plus::after{content:"\2013";}
.faq details p{font-size:14px;color:#4a4a4a;line-height:1.8;font-weight:300;
padding:0 20px 18px 58px;}
/* ============================================================
NEWSLETTER
============================================================ */
.news{background:var(--blush);padding:56px 0 64px;text-align:center;}
.news h2{font-family:var(--font-head);color:var(--teal);font-size:40px;
font-weight:400;line-height:1.2;}
.news__sub{color:var(--teal);font-size:13px;font-weight:300;margin:10px 0 26px;opacity:.8;}
.news__form{display:flex;justify-content:center;max-width:560px;margin:0 auto;}
.news__form input{flex:1;min-width:0;height:52px;padding:0 20px;
border:1px solid var(--teal);border-right:none;
border-radius:var(--btn-radius) 0 0 var(--btn-radius);
background:#fff;color:var(--teal);font-family:var(--font-body);
font-size:13px;letter-spacing:1.5px;text-transform:uppercase;outline:none;}
.news__form input::placeholder{color:var(--teal);opacity:.5;}
.news__form input:focus{box-shadow:inset 0 0 0 1px var(--teal);}
.news__form button{height:52px;padding:0 34px;border:none;cursor:pointer;
background:var(--red);color:#fff;font-family:var(--font-body);font-size:13px;
font-weight:500;letter-spacing:2px;text-transform:uppercase;
border-radius:0 var(--btn-radius) var(--btn-radius) 0;transition:background .2s;}
.news__form button:hover{background:#a81420;}
.sr-only{position:absolute;width:1px;height:1px;padding:0;overflow:hidden;
clip:rect(0 0 0 0);white-space:nowrap;border:0;}
@media(max-width:600px){
.news{padding:38px 0 44px;}
.news h2{font-size:26px;}
.news__form{flex-direction:column;gap:10px;padding:0 24px;}
.news__form input{border-right:1px solid var(--teal);border-radius:var(--btn-radius);}
.news__form button{border-radius:var(--btn-radius);}
}
/* >>>>> ABOUT PAGE CSS >>>>> */
/* ============================================================
ABOUT PAGE
============================================================ */
.abhero{padding:30px 0 6px;}
.abhero__inner{max-width:var(--maxw);margin:0 auto;padding:0 24px;}
.abhero__inner img{width:100%;height:clamp(300px,44vw,600px);object-fit:cover;
border-radius:var(--panel-radius);display:block;}
.abintro{padding:38px 0 16px;}
.abintro h1{font-family:var(--font-head);color:var(--teal);font-size:34px;font-weight:400;
text-transform:uppercase;letter-spacing:.4px;margin-bottom:18px;line-height:1.2;}
.abintro p{color:var(--teal);font-size:15px;line-height:1.9;font-weight:300;margin-bottom:14px;}
.sechead{text-align:center;padding:44px 0 8px;}
.sechead h2{font-family:var(--font-head);color:var(--teal);font-size:34px;
font-weight:400;text-transform:uppercase;letter-spacing:1px;line-height:1.2;}
.sechead p{color:var(--teal);font-size:14px;font-weight:300;margin-top:10px;opacity:.8;}
/* alternating photo + red card */
.bio{padding:22px 0;}
.bio__wrap{max-width:var(--maxw);margin:0 auto;padding:0 24px;
display:grid;grid-template-columns:1fr 1fr;align-items:center;}
.bio__media{height:500px;overflow:hidden;border-radius:var(--card-radius);}
.bio__media img{width:100%;height:100%;object-fit:cover;}
.bio__card{position:relative;z-index:2;background:var(--red);color:#fff;
border-radius:var(--card-radius);padding:40px;margin-left:-80px;}
.bio--flip .bio__media{order:2;}
.bio--flip .bio__card{order:1;margin-left:0;margin-right:-80px;}
.bio__card h3{font-family:var(--font-head);font-size:28px;font-weight:400;
text-transform:uppercase;letter-spacing:.5px;line-height:1.2;margin-bottom:18px;}
/* pulled up so the gap under the title is the same with or without a role line */
.bio__role{font-size:13px;color:#FCC304;margin:-12px 0 18px;font-weight:300;letter-spacing:.6px;}
.bio__card p{font-size:14px;line-height:1.8;font-weight:300;margin-bottom:12px;}
.bio__tag{display:block;margin-top:16px;font-family:var(--font-head);
font-size:16px;color:#FCC304;letter-spacing:.4px;}
/* team masonry */
.team{padding:52px 0 62px;}
.team__grid{display:grid;grid-template-columns:repeat(4,1fr);
grid-auto-rows:170px;grid-auto-flow:dense;gap:var(--gap);}
.member{position:relative;overflow:hidden;border-radius:var(--card-radius);}
.member img{width:100%;height:100%;object-fit:cover;transition:transform .6s ease;}
.member:hover img{transform:scale(1.06);}
.member__ph{width:100%;height:100%;background:#e2c9bf;display:flex;
align-items:center;justify-content:center;color:#9a7261;font-size:12px;
letter-spacing:2px;text-transform:uppercase;}
.member__cap{position:absolute;left:0;right:0;bottom:0;padding:20px 18px;color:#fff;
text-shadow:0 1px 3px rgba(0,0,0,.45);
background:linear-gradient(to top,rgba(0,0,0,.80) 0%,rgba(0,0,0,.44) 42%,transparent 82%);}
.member__cap b{display:block;font-family:var(--font-head);font-size:19px;font-weight:400;}
.member__cap span{display:block;font-size:12px;font-weight:300;opacity:.92;margin-top:3px;}
@media(max-width:1024px){
.team__grid{grid-template-columns:repeat(3,1fr);}
}
@media(max-width:900px){
.bio__wrap{grid-template-columns:1fr;padding:0 16px;}
.bio__media{height:320px;}
.bio__card{margin-left:0;margin-top:-28px;padding:32px 26px;}
.bio--flip .bio__media{order:1;}
.bio--flip .bio__card{order:2;margin-right:0;margin-top:-28px;}
}
@media(max-width:600px){
.abintro h1{font-size:24px;}
.sechead h2{font-size:24px;}
.team__grid{grid-template-columns:repeat(2,1fr);grid-auto-rows:130px;}
.member__cap b{font-size:15px;}
.member__cap span{font-size:11px;}
}
/* <<<<< ABOUT PAGE CSS <<<<< */
/* >>>>> FAQ PAGE CSS >>>>> */
/* ============================================================
FAQs PAGE
============================================================ */
.faqhead{text-align:center;padding:54px 0 8px;}
.faqhead h1{font-family:var(--font-head);color:var(--teal);font-size:46px;
font-weight:400;line-height:1.15;}
.faqhead p{color:var(--teal);font-size:15px;font-weight:300;margin-top:10px;opacity:.8;}
.faqpage{padding:26px 0 20px;}
.faqpage__inner{max-width:900px;margin:0 auto;padding:0 24px;}
.faqpage__group{margin-bottom:40px;}
.faqpage__label{font-size:12px;letter-spacing:2.6px;text-transform:uppercase;
color:var(--red);font-weight:500;margin-bottom:14px;}
/* white cards read better on the blush page than the blush ones used inside the red panel */
.faqpage .faq details{background:#fff;}
.faqpage .faq summary{font-size:15px;padding:20px 22px;}
.faqpage .faq details p{padding:0 22px 20px 22px;}
.faqpage .faq details p .todo{color:var(--red);font-weight:400;}
.askwrap{padding:20px 0 66px;}
.askbox{background:var(--red);border-radius:var(--panel-radius);padding:48px 52px;color:#fff;}
.askbox h2{font-family:var(--font-head);font-size:40px;font-weight:400;line-height:1.1;}
.askbox__sub{color:#FCC304;font-size:13px;margin:10px 0 30px;font-weight:300;}
.askform{display:grid;grid-template-columns:1fr 1fr;gap:16px;}
.askform label{display:block;font-size:11px;letter-spacing:1.6px;
text-transform:uppercase;margin-bottom:6px;}
.askform input,.askform textarea{width:100%;background:#fff;border:none;
border-radius:var(--btn-radius);padding:13px 16px;font-family:var(--font-body);
font-size:14px;font-weight:300;color:var(--teal);outline:none;}
.askform textarea{min-height:118px;resize:vertical;}
.askform input:focus,.askform textarea:focus{box-shadow:0 0 0 2px #FCC304;}
.askform .full{grid-column:1/-1;}
.askform button{justify-self:start;background:#fff;color:var(--red);border:none;
border-radius:var(--btn-radius);padding:15px 42px;cursor:pointer;
font-family:var(--font-body);font-size:13px;font-weight:500;letter-spacing:2px;
text-transform:uppercase;transition:.2s;}
.askform button:hover{background:#FCC304;color:var(--ink);}
.askbox__contact{margin-top:28px;padding-top:22px;
border-top:1px solid rgba(255,255,255,.28);
display:flex;gap:30px;flex-wrap:wrap;font-size:14px;font-weight:300;}
.askbox__contact a{border-bottom:1px solid rgba(255,255,255,.45);padding-bottom:2px;}
@media(max-width:767px){
.faqhead{padding:34px 0 4px;}
.faqhead h1{font-size:30px;}
.faqpage__inner{padding:0 16px;}
.askwrap{padding:10px 0 44px;}
.askbox{padding:32px 22px;border-radius:14px;}
.askbox h2{font-size:28px;}
.askform{grid-template-columns:1fr;}
.askform button{justify-self:stretch;}
}
/* <<<<< FAQ PAGE CSS <<<<< */
/* >>>>> BLOG CSS >>>>> */
/* ============================================================
BLOG
============================================================ */
.bloghead{text-align:center;padding:52px 0 6px;}
.bloghead__label{font-size:12px;letter-spacing:2.6px;text-transform:uppercase;
color:var(--red);font-weight:500;}
.bloghead h1{font-family:var(--font-head);color:var(--teal);font-size:46px;
font-weight:400;line-height:1.15;margin-top:8px;}
.bloghead p{color:var(--teal);font-size:15px;font-weight:300;margin-top:10px;opacity:.8;}
.catbar{display:flex;flex-wrap:wrap;gap:10px;justify-content:center;padding:26px 24px 0;}
.catbar a{padding:8px 20px;border-radius:999px;border:1px solid rgba(5,81,77,.28);
font-size:13px;color:var(--teal);transition:.2s;}
.catbar a:hover{border-color:var(--teal);}
.catbar a.is-active{background:var(--red);border-color:var(--red);color:#fff;}
/* featured post */
.feature{padding:34px 0 10px;}
.feature__card{display:grid;grid-template-columns:1.15fr 1fr;background:#fff;
border-radius:var(--panel-radius);overflow:hidden;}
.feature__img{overflow:hidden;min-height:340px;}
.feature__img img{width:100%;height:100%;object-fit:cover;transition:transform .6s ease;}
.feature__card:hover .feature__img img{transform:scale(1.04);}
.feature__body{padding:42px 44px;display:flex;flex-direction:column;justify-content:center;}
.feature__body h2{font-family:var(--font-head);color:var(--teal);font-size:30px;
font-weight:400;line-height:1.25;margin-top:12px;}
.feature__body p{font-size:15px;line-height:1.8;color:#5c5c5c;font-weight:300;margin-top:14px;}
/* post grid */
.postwrap{padding:30px 0 20px;}
.postgrid{display:grid;grid-template-columns:repeat(3,1fr);gap:28px;}
.post{background:#fff;border-radius:var(--card-radius);overflow:hidden;
display:flex;flex-direction:column;}
/* aspect-ratio sits on the ![]()
, not the wrapper: the wrapper is a column-flex
child with auto height, so height:100% on the image would resolve to 0 */
.post__img{overflow:hidden;}
.post__img img{width:100%;aspect-ratio:3/2;object-fit:cover;display:block;
transition:transform .6s ease;}
.post__ph{display:block;width:100%;aspect-ratio:3/2;background:#e2c9bf;}
.post:hover .post__img img{transform:scale(1.05);}
.post__body{padding:22px 22px 26px;display:flex;flex-direction:column;flex:1;}
.post__body h3{font-family:var(--font-head);color:var(--teal);font-size:20px;
font-weight:400;line-height:1.3;margin-top:12px;}
.post__body p{font-size:14px;line-height:1.75;color:#5c5c5c;font-weight:300;
margin-top:10px;flex:1;}
.meta{display:flex;gap:10px;align-items:center;flex-wrap:wrap;
font-size:11px;letter-spacing:1.4px;text-transform:uppercase;}
.meta .cat{background:var(--red);color:#fff;padding:4px 12px;border-radius:999px;}
.meta .date{color:#93817a;}
.more{margin-top:18px;font-size:12px;letter-spacing:1.6px;text-transform:uppercase;
color:var(--red);border-bottom:1px solid var(--red);align-self:flex-start;padding-bottom:3px;}
/* pagination */
.pager{display:flex;justify-content:center;gap:8px;margin-top:46px;}
.pager a,.pager span{min-width:44px;height:44px;padding:0 14px;
display:flex;align-items:center;justify-content:center;border-radius:var(--btn-radius);
border:1px solid rgba(5,81,77,.25);color:var(--teal);font-size:14px;transition:.2s;}
.pager a:hover{border-color:var(--teal);}
.pager .is-current{background:var(--red);border-color:var(--red);color:#fff;}
/* single post */
.article{padding:44px 0 10px;}
.article__inner{max-width:780px;margin:0 auto;padding:0 24px;}
.crumbs{font-size:12px;color:var(--teal);opacity:.7;margin-bottom:20px;}
.crumbs a{border-bottom:1px solid rgba(5,81,77,.3);}
.article h1{font-family:var(--font-head);color:var(--teal);font-size:42px;
font-weight:400;line-height:1.2;margin-top:14px;}
.article__hero{max-width:1000px;margin:32px auto 6px;padding:0 24px;}
.article__hero img{width:100%;height:clamp(260px,38vw,470px);object-fit:cover;
border-radius:var(--panel-radius);display:block;}
.article__cap{text-align:center;font-size:12px;color:var(--teal);opacity:.6;margin-top:10px;}
.prose{max-width:780px;margin:0 auto;padding:26px 24px 0;}
.prose p{font-size:16px;line-height:1.9;color:#3f3f3f;font-weight:300;margin-bottom:20px;}
.prose h2{font-family:var(--font-head);color:var(--teal);font-size:28px;
font-weight:400;margin:36px 0 14px;line-height:1.3;}
.prose h3{font-family:var(--font-head);color:var(--teal);font-size:21px;
font-weight:400;margin:26px 0 10px;}
.prose ul,.prose ol{margin:0 0 22px 22px;}
.prose li{font-size:16px;line-height:1.9;color:#3f3f3f;font-weight:300;margin-bottom:6px;}
.prose blockquote{border-left:3px solid var(--red);padding:4px 0 4px 24px;margin:30px 0;
font-family:var(--font-head);font-size:21px;line-height:1.5;color:var(--teal);}
.prose strong{font-weight:500;color:var(--teal);}
.prose a{color:var(--red);border-bottom:1px solid var(--red);}
.share{max-width:780px;margin:34px auto 0;padding:22px 24px;
border-top:1px solid rgba(5,81,77,.16);border-bottom:1px solid rgba(5,81,77,.16);
display:flex;align-items:center;gap:14px;flex-wrap:wrap;}
.share span{font-size:12px;letter-spacing:1.8px;text-transform:uppercase;color:var(--teal);}
.share a{font-size:12px;letter-spacing:1.2px;text-transform:uppercase;color:var(--red);
border:1px solid var(--red);border-radius:var(--btn-radius);padding:7px 16px;transition:.2s;}
.share a:hover{background:var(--red);color:#fff;}
/* comments */
.comments{padding:44px 0 6px;}
.comments__inner{max-width:780px;margin:0 auto;padding:0 24px;}
.comments h2{font-family:var(--font-head);color:var(--teal);font-size:28px;
font-weight:400;margin-bottom:24px;}
.comments h2 em{font-style:normal;color:var(--red);}
.commentlist{list-style:none;}
/* WordPress nests replies in */
.commentlist .children{list-style:none;margin-left:58px;}
.comment{display:flex;gap:16px;background:#fff;border-radius:var(--card-radius);
padding:22px 24px;margin-bottom:14px;}
.comment--child{margin-left:58px;}
.commentlist .children .comment--child{margin-left:0;}
.comment--author .comment__avatar{background:var(--teal);}
.comment__avatar{width:44px;height:44px;flex:0 0 auto;border-radius:50%;
background:var(--red);color:#fff;display:flex;align-items:center;justify-content:center;
font-family:var(--font-head);font-size:16px;}
.comment__head{display:flex;align-items:baseline;gap:12px;flex-wrap:wrap;margin-bottom:8px;}
.comment__head b{font-family:var(--font-head);color:var(--teal);font-size:17px;font-weight:400;}
.comment__badge{background:var(--teal);color:#fff;font-size:10px;letter-spacing:1.2px;
text-transform:uppercase;padding:3px 9px;border-radius:999px;}
.comment__head span{font-size:12px;color:#93817a;letter-spacing:.6px;}
.comment__body p{font-size:15px;line-height:1.8;color:#4a4a4a;font-weight:300;}
.comment__reply,.comment-reply-link{display:inline-block;margin-top:10px;font-size:11px;
letter-spacing:1.6px;text-transform:uppercase;color:var(--red);
border-bottom:1px solid var(--red);padding-bottom:2px;}
/* .comment-respond is what WordPress core wraps the form in */
.respond,.comment-respond{background:#fff;border-radius:var(--panel-radius);
padding:34px 34px 38px;margin-top:34px;}
.respond h3,.comment-respond .respond__title{font-family:var(--font-head);
color:var(--teal);font-size:24px;font-weight:400;}
.respond__note{font-size:12px;color:#8a7a72;margin:8px 0 22px;font-weight:300;}
.respond__form{display:grid;grid-template-columns:1fr 1fr;gap:16px;}
.respond__form .full{grid-column:1/-1;}
.respond__form label{display:block;font-size:11px;letter-spacing:1.6px;
text-transform:uppercase;color:var(--teal);margin-bottom:6px;}
/* exclude submit + checkbox so they do not pick up the text-field styling */
.respond__form input:not([type=submit]):not([type=checkbox]),
.respond__form textarea{width:100%;background:var(--blush);
border:1px solid rgba(5,81,77,.26);border-radius:var(--btn-radius);padding:12px 15px;
font-family:var(--font-body);font-size:14px;font-weight:300;color:var(--teal);outline:none;}
.respond__form textarea{min-height:130px;resize:vertical;}
.respond__form input:not([type=submit]):focus,
.respond__form textarea:focus{border-color:var(--teal);
box-shadow:0 0 0 2px rgba(5,81,77,.12);}
/* scoped to .respond__form so it outranks the `.respond__form label` rule above */
.respond__form .checkline{grid-column:1/-1;display:flex;align-items:center;gap:10px;
font-size:13px;color:#5c5c5c;font-weight:300;
text-transform:none;letter-spacing:0;margin-bottom:0;}
.respond__form .checkline input{width:16px;height:16px;flex:0 0 auto;
accent-color:var(--red);padding:0;}
.respond__form button,.respond__form input[type=submit]{grid-column:1/-1;justify-self:start;
background:var(--red);color:#fff;border:none;border-radius:var(--btn-radius);
padding:14px 40px;cursor:pointer;font-family:var(--font-body);font-size:13px;
font-weight:500;letter-spacing:2px;text-transform:uppercase;transition:background .2s;
-webkit-appearance:none;appearance:none;}
.respond__form button:hover,.respond__form input[type=submit]:hover{background:#a81420;}
/* core prints .form-submit around the button */
.respond__form .form-submit{grid-column:1/-1;margin:0;}
.related{padding:48px 0 20px;}
.related h2{font-family:var(--font-head);color:var(--teal);font-size:30px;
font-weight:400;text-align:center;margin-bottom:30px;}
@media(max-width:1024px){
.postgrid{grid-template-columns:repeat(2,1fr);}
}
@media(max-width:600px){
.comment{flex-direction:column;gap:12px;}
.comment--child{margin-left:18px;}
.respond{padding:26px 22px 30px;}
.respond__form{grid-template-columns:1fr;}
.respond__form button,.respond__form input[type=submit]{justify-self:stretch;}
}
@media(max-width:767px){
.bloghead{padding:34px 0 2px;}
.bloghead h1{font-size:30px;}
.feature__card{grid-template-columns:1fr;}
.feature__img{min-height:220px;aspect-ratio:3/2;}
.feature__body{padding:28px 24px 32px;}
.feature__body h2{font-size:23px;}
.postgrid{grid-template-columns:1fr;gap:22px;}
.article h1{font-size:27px;}
.prose p,.prose li{font-size:15px;}
.prose h2{font-size:23px;}
.prose blockquote{font-size:18px;}
}
/* <<<<< BLOG CSS <<<<< */
/* >>>>> PORTFOLIO CSS >>>>> */
/* ============================================================
PORTFOLIO
============================================================ */
.folio{padding:26px 0 56px;}
/* align-items:center keeps the card at its own height so the taller photo
frames it, and the negative margin pulls the card over the photo */
.folio__row{display:grid;grid-template-columns:1fr 1fr;align-items:center;margin-bottom:26px;}
.folio__card{position:relative;z-index:2;background:var(--red);color:#fff;
border-radius:var(--card-radius);padding:34px 32px;margin-right:-72px;}
.folio__row:nth-child(even) .folio__card{order:2;margin-right:0;margin-left:-72px;}
.folio__card h3{font-family:var(--font-head);font-size:24px;font-weight:400;
text-transform:uppercase;letter-spacing:.5px;line-height:1.25;}
.folio__tag{font-size:12px;color:#FCC304;letter-spacing:1.4px;
text-transform:uppercase;margin-top:8px;}
.folio__card p{font-size:14px;line-height:1.8;font-weight:300;margin-top:16px;}
.folio__items{margin-top:16px;display:flex;flex-wrap:wrap;gap:8px;}
.folio__items span{border:1px solid rgba(255,255,255,.45);border-radius:999px;
padding:5px 13px;font-size:11px;letter-spacing:1.1px;text-transform:uppercase;}
/* the photo is the tall element; the card floats over it */
.folio__media{border-radius:var(--card-radius);overflow:hidden;
height:clamp(340px,33vw,480px);}
.folio__media img{width:100%;height:100%;object-fit:cover;display:block;
transition:transform .6s ease;}
.folio__media:hover img{transform:scale(1.04);}
@media(max-width:900px){
.folio{padding:14px 0 34px;}
/* one column: photo first, card tucked under it with a small overlap */
.folio__row{grid-template-columns:1fr;margin-bottom:30px;}
.folio__row .folio__media{order:1;height:250px;}
.folio__row:nth-child(even) .folio__card,
.folio__row .folio__card{order:2;padding:26px 22px;
margin:-34px 16px 0;}
.folio__card h3{font-size:20px;}
}
/* <<<<< PORTFOLIO CSS <<<<< */
/* >>>>> COLLECTION CSS >>>>> */
/* ============================================================
SHOP COLLECTION
============================================================ */
.colhead{text-align:center;padding:46px 0 6px;}
.colhead h1{font-family:var(--font-head);color:var(--teal);font-size:38px;
font-weight:400;line-height:1.2;}
.colhead p{color:var(--teal);font-size:14px;font-weight:300;margin-top:10px;opacity:.78;}
.shopbar{display:flex;justify-content:space-between;align-items:flex-end;
gap:16px;flex-wrap:wrap;padding:24px 0 28px;}
.shopbar__group{display:flex;flex-direction:column;gap:7px;}
.shopbar__label{font-size:11px;letter-spacing:1.8px;text-transform:uppercase;
color:var(--teal);opacity:.8;}
.selectwrap{position:relative;display:inline-block;}
.selectwrap select{appearance:none;-webkit-appearance:none;
background:var(--red);color:#fff;border:none;border-radius:var(--btn-radius);
padding:12px 46px 12px 18px;cursor:pointer;min-width:210px;
font-family:var(--font-body);font-size:13px;font-weight:500;
letter-spacing:1.4px;text-transform:uppercase;outline:none;}
.selectwrap select:focus{box-shadow:0 0 0 2px #FCC304;}
.selectwrap::after{content:"";position:absolute;right:18px;top:50%;
width:8px;height:8px;border-right:2px solid #fff;border-bottom:2px solid #fff;
transform:translateY(-70%) rotate(45deg);pointer-events:none;}
.selectwrap select option{background:#fff;color:var(--teal);
text-transform:none;letter-spacing:0;}
.prodwrap{padding:0 0 20px;}
.prodgrid{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;}
.prod{display:flex;flex-direction:column;background:#fff;
border-radius:var(--card-radius);overflow:hidden;}
.prod__img{overflow:hidden;}
/* aspect-ratio on the ![]()
, not the wrapper: the wrapper is a column-flex
child with auto height, so height:100% would resolve to 0 */
.prod__img img{width:100%;aspect-ratio:1/1;object-fit:cover;display:block;
transition:transform .6s ease;}
.prod:hover .prod__img img{transform:scale(1.05);}
.prod__band{background:var(--teal);color:#fff;padding:15px 18px 17px;margin-top:auto;}
.prod__price{font-size:20px;font-weight:400;letter-spacing:.3px;}
.prod__name{font-size:13px;font-weight:300;line-height:1.45;margin-top:4px;opacity:.92;
display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;}
@media(max-width:1024px){ .prodgrid{grid-template-columns:repeat(2,1fr);} }
@media(max-width:767px){
.colhead{padding:30px 0 2px;}
.colhead h1{font-size:26px;}
.shopbar{padding:16px 0 20px;}
.shopbar__group{flex:1;}
.selectwrap,.selectwrap select{width:100%;min-width:0;}
.prodgrid{gap:14px;}
.prod__price{font-size:17px;}
.prod__name{font-size:12px;}
}
/* <<<<< COLLECTION CSS <<<<< */
/* >>>>> PRODUCT PAGE CSS >>>>> */
/* ============================================================
PRODUCT PAGE
============================================================ */
.pdp{padding:26px 0 12px;}
.crumbpill{display:inline-flex;align-items:center;gap:9px;background:var(--red);color:#fff;
border-radius:var(--btn-radius);padding:9px 16px;margin-bottom:24px;
font-size:11px;letter-spacing:1.5px;text-transform:uppercase;}
.crumbpill svg{width:14px;height:14px;stroke:#fff;fill:none;stroke-width:1.8;
stroke-linecap:round;stroke-linejoin:round;}
.crumbpill span{opacity:.7;}
.pdp__grid{display:grid;grid-template-columns:1.05fr 1fr;gap:48px;align-items:start;}
/* radio-driven gallery - no JavaScript */
.gallery input{position:absolute;width:1px;height:1px;opacity:0;pointer-events:none;}
.gallery__stage{position:relative;border-radius:var(--card-radius);overflow:hidden;background:#fff;}
.gallery__stage img{width:100%;aspect-ratio:1/1;object-fit:cover;display:block;
opacity:0;transition:opacity .25s ease;}
.gallery__stage img+img{position:absolute;inset:0;}
.gallery__thumbs{display:flex;gap:10px;margin-top:12px;}
.gallery__thumbs label{width:78px;border-radius:8px;overflow:hidden;cursor:pointer;
outline:2px solid transparent;outline-offset:1px;transition:outline-color .2s;}
.gallery__thumbs img{width:100%;aspect-ratio:1/1;object-fit:cover;display:block;}
#pg1:checked~.gallery__stage .pg1,
#pg2:checked~.gallery__stage .pg2,
#pg3:checked~.gallery__stage .pg3{opacity:1;}
#pg1:checked~.gallery__thumbs label[for=pg1],
#pg2:checked~.gallery__thumbs label[for=pg2],
#pg3:checked~.gallery__thumbs label[for=pg3]{outline-color:var(--red);}
.gallery input:focus-visible~.gallery__thumbs label{outline-color:var(--teal);}
.pdp__title{font-family:var(--font-head);color:var(--teal);font-size:34px;
font-weight:400;line-height:1.2;}
.pdp__price{font-family:var(--font-head);color:var(--teal);font-size:30px;margin-top:14px;}
.pdp__note{font-size:13px;color:#5c5c5c;font-weight:300;margin-top:8px;line-height:1.6;}
.pdp__note b{color:var(--teal);font-weight:500;}
.quote{display:inline-flex;align-items:center;gap:10px;background:var(--red);color:#fff;
border-radius:var(--btn-radius);padding:15px 30px;margin-top:24px;
font-size:14px;letter-spacing:1.4px;text-transform:uppercase;font-weight:500;
transition:background .2s;}
.quote:hover{background:#a81420;}
.quote svg{width:20px;height:20px;fill:#fff;flex:0 0 auto;}
.pdp__desc{margin-top:28px;font-size:15px;line-height:1.85;color:#454545;font-weight:300;}
.pdp__desc p+p{margin-top:14px;}
.pdp__spec{margin-top:18px;font-size:14px;color:var(--teal);font-weight:300;line-height:1.9;}
.pdp__spec b{font-weight:500;}
.pdp__acc{margin-top:26px;}
.pdp__share{display:flex;gap:18px;align-items:center;margin-top:24px;padding-top:22px;
border-top:1px solid rgba(5,81,77,.16);}
.pdp__share span{font-size:11px;letter-spacing:1.8px;text-transform:uppercase;
color:var(--teal);opacity:.8;}
.pdp__share a svg{width:20px;height:20px;fill:var(--teal);transition:fill .2s;}
.pdp__share a:hover svg{fill:var(--red);}
.alsolike{padding:48px 0 20px;}
.alsolike h2{font-family:var(--font-head);color:var(--teal);font-size:30px;
font-weight:400;margin-bottom:28px;}
@media(max-width:900px){
.pdp__grid{grid-template-columns:1fr;gap:28px;}
.pdp__title{font-size:26px;}
.pdp__price{font-size:24px;}
.alsolike h2{font-size:24px;text-align:center;}
}
@media(max-width:600px){
.gallery__thumbs label{width:62px;}
.quote{width:100%;justify-content:center;}
}
/* <<<<< PRODUCT PAGE CSS <<<<< */
/* >>>>> SEARCH CART CONTACT LEGAL CSS >>>>> */
/* ============================================================
CART DRAWER
============================================================ */
.cart-toggle{position:absolute;width:1px;height:1px;opacity:0;pointer-events:none;}
.cartov{position:fixed;inset:0;background:rgba(0,0,0,.45);z-index:80;cursor:pointer;
opacity:0;visibility:hidden;transition:opacity .3s ease,visibility .3s;}
.cartdrawer{position:fixed;top:0;right:0;height:100%;width:min(400px,92vw);z-index:90;
background:var(--blush);display:flex;flex-direction:column;
transform:translateX(100%);transition:transform .35s cubic-bezier(.4,0,.2,1);}
#gk-cart:checked~.cartov{opacity:1;visibility:visible;}
#gk-cart:checked~.cartdrawer{transform:none;}
.cartdrawer__head{display:flex;align-items:center;justify-content:space-between;
padding:22px 24px;border-bottom:1px solid rgba(5,81,77,.16);}
.cartdrawer__head h2{font-family:var(--font-head);color:var(--teal);
font-size:22px;font-weight:400;}
.cartdrawer__head em{font-style:normal;color:var(--red);}
.cartclose{width:34px;height:34px;border-radius:50%;cursor:pointer;
display:flex;align-items:center;justify-content:center;
border:1px solid rgba(5,81,77,.3);transition:.2s;}
.cartclose:hover{background:var(--red);border-color:var(--red);}
.cartclose svg{width:14px;height:14px;stroke:var(--teal);fill:none;
stroke-width:2.2;stroke-linecap:round;}
.cartclose:hover svg{stroke:#fff;}
.cartitems{flex:1;overflow-y:auto;padding:18px 24px;}
.citem{display:flex;gap:14px;padding:16px 0;border-bottom:1px solid rgba(5,81,77,.12);}
.citem__img{width:74px;height:74px;flex:0 0 auto;border-radius:10px;overflow:hidden;}
.citem__img img{width:100%;height:100%;object-fit:cover;display:block;}
.citem__body{flex:1;min-width:0;}
.citem__name{font-size:13px;color:var(--teal);font-weight:400;line-height:1.45;
display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;}
.citem__price{font-size:13px;color:var(--red);margin-top:5px;font-weight:400;}
.citem__row{display:flex;align-items:center;justify-content:space-between;margin-top:9px;}
.qty{display:inline-flex;align-items:center;border:1px solid rgba(5,81,77,.28);
border-radius:var(--btn-radius);overflow:hidden;}
.qty button{width:30px;height:30px;border:none;background:none;cursor:pointer;
color:var(--teal);font-size:15px;line-height:1;transition:background .2s;}
.qty button:hover{background:rgba(5,81,77,.09);}
.qty span{min-width:30px;text-align:center;font-size:13px;color:var(--teal);}
.citem__rm{background:none;border:none;cursor:pointer;font-size:11px;letter-spacing:1.2px;
text-transform:uppercase;color:#9a8078;transition:color .2s;font-family:var(--font-body);}
.citem__rm:hover{color:var(--red);}
.cartfoot{padding:20px 24px 24px;border-top:1px solid rgba(5,81,77,.16);background:#fff;}
.cartfoot__row{display:flex;justify-content:space-between;align-items:baseline;
font-size:14px;color:var(--teal);}
.cartfoot__row b{font-family:var(--font-head);font-size:19px;font-weight:400;}
.cartfoot__note{font-size:12px;color:#7d6a63;font-weight:300;margin:8px 0 16px;line-height:1.6;}
.cartfoot .quote{margin-top:0;width:100%;justify-content:center;}
.cartlink{display:block;text-align:center;margin-top:10px;font-size:12px;
letter-spacing:1.4px;text-transform:uppercase;color:var(--teal);
border-bottom:1px solid rgba(5,81,77,.3);padding-bottom:3px;width:fit-content;
margin-left:auto;margin-right:auto;}
.cartempty{text-align:center;padding:60px 20px;color:var(--teal);font-weight:300;}
/* ============================================================
SEARCH
============================================================ */
.searchhead{text-align:center;padding:46px 0 4px;}
.searchhead h1{font-family:var(--font-head);color:var(--teal);font-size:40px;
font-weight:400;line-height:1.2;}
.searchform{display:flex;max-width:620px;margin:24px auto 8px;}
.searchform input{flex:1;min-width:0;height:54px;padding:0 20px;background:#fff;
border:1px solid rgba(5,81,77,.3);border-right:none;
border-radius:var(--btn-radius) 0 0 var(--btn-radius);
font-family:var(--font-body);font-size:15px;font-weight:300;color:var(--teal);outline:none;}
.searchform input::placeholder{color:var(--teal);opacity:.45;}
.searchform input:focus{border-color:var(--teal);}
.searchform button{height:54px;padding:0 28px;border:none;cursor:pointer;background:var(--red);
color:#fff;border-radius:0 var(--btn-radius) var(--btn-radius) 0;
display:flex;align-items:center;gap:9px;
font-family:var(--font-body);font-size:13px;font-weight:500;letter-spacing:1.6px;
text-transform:uppercase;transition:background .2s;}
.searchform button:hover{background:#a81420;}
.searchform button svg{width:17px;height:17px;stroke:#fff;fill:none;stroke-width:2;}
.searchcount{text-align:center;color:var(--teal);font-size:14px;font-weight:300;
opacity:.78;margin-bottom:30px;}
.searchcount b{font-weight:500;opacity:1;}
.searchsec{padding:0 0 20px;}
.searchsec h2{font-family:var(--font-head);color:var(--teal);font-size:24px;
font-weight:400;margin-bottom:20px;}
.hitlist{display:flex;flex-direction:column;gap:12px;}
.hit{display:block;background:#fff;border-radius:var(--card-radius);padding:20px 24px;}
.hit__kind{font-size:10px;letter-spacing:1.6px;text-transform:uppercase;color:var(--red);}
.hit h3{font-family:var(--font-head);color:var(--teal);font-size:19px;
font-weight:400;margin-top:6px;}
.hit p{font-size:14px;color:#5c5c5c;font-weight:300;line-height:1.7;margin-top:6px;}
.hit mark{background:#FCC304;color:var(--ink);padding:0 3px;}
.noresult{text-align:center;background:#fff;border-radius:var(--panel-radius);
padding:56px 30px;max-width:640px;margin:0 auto;}
.noresult h2{font-family:var(--font-head);color:var(--teal);font-size:26px;font-weight:400;}
.noresult p{font-size:14px;color:#5c5c5c;font-weight:300;margin-top:10px;line-height:1.8;}
.noresult__tips{display:flex;flex-wrap:wrap;gap:9px;justify-content:center;margin-top:20px;}
.noresult__tips a{border:1px solid rgba(5,81,77,.28);border-radius:999px;
padding:8px 18px;font-size:13px;color:var(--teal);}
.noresult__tips a:hover{border-color:var(--teal);}
/* ============================================================
CONTACT
============================================================ */
.contact{padding:14px 0 20px;}
.contact__grid{display:grid;grid-template-columns:.85fr 1.15fr;gap:26px;align-items:start;}
.infocard{background:#fff;border-radius:var(--panel-radius);padding:34px 32px;}
.infocard h2{font-family:var(--font-head);color:var(--teal);font-size:24px;font-weight:400;}
.inforow{display:flex;gap:14px;margin-top:24px;}
.inforow svg{width:20px;height:20px;flex:0 0 auto;margin-top:2px;
stroke:var(--red);fill:none;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round;}
.inforow small{display:block;font-size:11px;letter-spacing:1.6px;text-transform:uppercase;
color:var(--red);margin-bottom:3px;}
.inforow span{font-size:14px;color:var(--teal);font-weight:300;line-height:1.65;}
.infosocial{display:flex;gap:14px;margin-top:28px;padding-top:22px;
border-top:1px solid rgba(5,81,77,.16);}
.infosocial a svg{width:20px;height:20px;fill:var(--teal);stroke:none;transition:fill .2s;}
.infosocial a:hover svg{fill:var(--red);}
.mapwrap{margin-top:26px;border-radius:var(--panel-radius);overflow:hidden;
background:#e2d3cc;height:300px;}
.mapwrap iframe{width:100%;height:100%;border:0;display:block;}
/* ============================================================
LEGAL PAGES
============================================================ */
.legal{padding:14px 0 30px;}
.legal__grid{display:grid;grid-template-columns:250px 1fr;gap:40px;align-items:start;}
.legalnav{background:#fff;border-radius:var(--card-radius);padding:20px 8px;
position:sticky;top:20px;}
.legalnav p{font-size:11px;letter-spacing:1.8px;text-transform:uppercase;
color:var(--red);padding:0 16px 10px;}
.legalnav a{display:block;padding:11px 16px;font-size:14px;color:var(--teal);
font-weight:300;border-left:2px solid transparent;transition:.2s;}
.legalnav a:hover{background:rgba(5,81,77,.05);}
.legalnav a.is-active{border-left-color:var(--red);color:var(--red);font-weight:400;
background:rgba(211,27,41,.06);}
.legalbody{background:#fff;border-radius:var(--panel-radius);padding:40px 44px 46px;}
.legalbody h1{font-family:var(--font-head);color:var(--teal);font-size:34px;
font-weight:400;line-height:1.2;}
.legalbody .updated{font-size:12px;color:#8a7a72;margin-top:8px;
padding-bottom:22px;border-bottom:1px solid rgba(5,81,77,.14);}
.legalbody h2{font-family:var(--font-head);color:var(--teal);font-size:21px;
font-weight:400;margin:30px 0 10px;}
.legalbody p{font-size:15px;line-height:1.85;color:#454545;font-weight:300;margin-bottom:12px;}
.legalbody ul{margin:0 0 16px 20px;}
.legalbody li{font-size:15px;line-height:1.85;color:#454545;font-weight:300;margin-bottom:5px;}
.legalbody a{color:var(--red);border-bottom:1px solid var(--red);}
.legalnote{background:var(--blush);border-radius:var(--card-radius);
padding:20px 22px;margin-top:26px;}
.legalnote p{font-size:14px;margin:0;color:var(--teal);}
@media(max-width:900px){
.contact__grid{grid-template-columns:1fr;}
.legal__grid{grid-template-columns:1fr;gap:18px;}
.legalnav{position:static;}
.legalbody{padding:28px 22px 32px;}
.legalbody h1{font-size:26px;}
}
@media(max-width:600px){
.searchhead h1{font-size:27px;}
.searchform{flex-direction:column;gap:10px;padding:0 4px;}
.searchform input{border-right:1px solid rgba(5,81,77,.3);border-radius:var(--btn-radius);}
.searchform button{border-radius:var(--btn-radius);justify-content:center;}
.infocard{padding:26px 22px;}
}
/* <<<<< SEARCH CART CONTACT LEGAL CSS <<<<< */
/* >>>>> PARALLAX CTA + MOTION CSS >>>>> */
/* ============================================================
PARALLAX VIDEO CTA
============================================================ */
/* clip-path on the parent clips a position:fixed child to this box without
making it scroll with the page - that is what produces the parallax window.
(transform/filter would create a containing block and kill the effect.) */
.vcta{position:relative;overflow:hidden;clip-path:inset(0);
height:clamp(430px,56vw,620px);display:flex;align-items:center;justify-content:center;
text-align:center;background:#1c1512;}
.vcta__bg{position:fixed;top:0;left:0;width:100%;height:100vh;
object-fit:cover;z-index:0;}
/* two layers: a vertical wash plus a soft pool behind the copy, so the text
stays readable over the bright frames of the clip */
.vcta__veil{position:absolute;inset:0;z-index:1;
background:
radial-gradient(60% 55% at 50% 52%,rgba(20,14,11,.55),transparent 78%),
linear-gradient(180deg,rgba(20,14,11,.74),rgba(20,14,11,.60) 45%,rgba(20,14,11,.80));}
.vcta__inner{position:relative;z-index:2;max-width:760px;padding:0 26px;color:#fff;}
.vcta__eyebrow{font-size:12px;letter-spacing:3px;text-transform:uppercase;color:#FCC304;}
.vcta h2{font-family:var(--font-head);font-size:clamp(28px,4.2vw,48px);
font-weight:400;line-height:1.18;margin-top:14px;}
.vcta p{font-size:16px;font-weight:300;line-height:1.75;margin-top:16px;opacity:.92;}
.vcta__btns{display:flex;gap:14px;justify-content:center;flex-wrap:wrap;margin-top:30px;}
.vcta__btns .btn{margin-top:0;}
.vcta__btns .btn--solid{border-color:var(--red);}
@media(max-width:900px){
/* fixed backgrounds stutter badly on touch devices */
.vcta{clip-path:none;}
.vcta__bg{position:absolute;height:100%;}
}
@media(prefers-reduced-motion:reduce){
.vcta__bg{display:none;}
.vcta{background:#1c1512 url(https://gulkhancorporate.com/wp-content/uploads/2026/06/1-12.jpg) center/cover;}
}
/* ============================================================
MOTION - reveal on scroll, hovers, hero entrance
============================================================ */
@keyframes gkRise{from{opacity:0;transform:translateY(26px)}to{opacity:1;transform:none}}
@keyframes gkFade{from{opacity:0}to{opacity:1}}
@keyframes gkSweep{from{transform:translateX(-120%)}to{transform:translateX(220%)}}
@keyframes gkDot{0%,100%{transform:scale(1);opacity:1}50%{transform:scale(1.5);opacity:.55}}
/* hero copy comes in on load, staggered */
@media(prefers-reduced-motion:no-preference){
.hero__title{animation:gkRise .8s cubic-bezier(.2,.7,.3,1) .15s both;}
.hero__sub{animation:gkRise .8s cubic-bezier(.2,.7,.3,1) .32s both;}
.hero__overlay .btn{animation:gkRise .8s cubic-bezier(.2,.7,.3,1) .48s both;}
.announce__dot{animation:gkDot 2.6s ease-in-out infinite;}
}
/* scroll reveal - only where the browser supports scroll-driven animations,
so anywhere else the content simply shows as before */
@supports (animation-timeline: view()){
@media(prefers-reduced-motion:no-preference){
.section__head,.masonry .card,.usp__item,.promo__card,.promo__media,
.review,.insta__cell,.help__box,.news .wrap,.city,.bio__card,.bio__media,
.member,.post,.prod,.folio__card,.folio__media,.faqpage__group,.hit,
.infocard,.mapwrap,.legalbody,.legalnav,.article__hero,.feature__card,
.askbox,.vcta__inner,.colhead,.bloghead,.trusted h2,.mapsec__panel,
.cities h2,.related,.alsolike{
animation:gkRise .75s cubic-bezier(.2,.7,.3,1) both;
animation-timeline:view();
animation-range:entry 0% entry 48%;
}
/* grid children stagger a touch so a row does not pop as one block */
.masonry .card:nth-child(2n),.postgrid .post:nth-child(2n),
.prodgrid .prod:nth-child(2n),.usp__item:nth-child(2n){animation-delay:.06s;}
.masonry .card:nth-child(3n),.postgrid .post:nth-child(3n),
.prodgrid .prod:nth-child(3n),.usp__item:nth-child(3n){animation-delay:.12s;}
}
}
/* hover polish */
@media(prefers-reduced-motion:no-preference){
.post,.prod,.review,.hit,.member,.feature__card{
transition:transform .35s ease,box-shadow .35s ease;}
.post:hover,.prod:hover,.hit:hover,.feature__card:hover{
transform:translateY(-5px);box-shadow:0 14px 30px rgba(90,45,30,.13);}
.member:hover{transform:translateY(-4px);}
.review:hover{transform:translateY(-3px);}
}
/* sweep across solid red buttons */
.btn--solid,.quote,.news__form button,.searchform button,.respond__form button,
.askform button,.respond__form input[type=submit]{position:relative;overflow:hidden;}
.btn--solid::after,.quote::after,.news__form button::after,.searchform button::after{
content:"";position:absolute;top:0;left:0;width:38%;height:100%;pointer-events:none;
background:linear-gradient(100deg,transparent,rgba(255,255,255,.34),transparent);
transform:translateX(-120%);}
@media(prefers-reduced-motion:no-preference){
.btn--solid:hover::after,.quote:hover::after,
.news__form button:hover::after,.searchform button:hover::after{
animation:gkSweep .75s ease;}
}
/* outline buttons: gentle lift */
.btn{transition:background .25s,color .25s,border-color .25s,transform .25s;}
@media(prefers-reduced-motion:no-preference){
.btn:hover{transform:translateY(-2px);}
}
/* nav underline grows from the middle instead of snapping on */
.nav a{position:relative;border-bottom-color:transparent !important;}
.nav a::after{content:"";position:absolute;left:50%;right:50%;bottom:0;height:1px;
background:var(--teal);transition:left .28s ease,right .28s ease;}
.nav a:hover::after{left:0;right:0;}
/* footer links nudge across on hover */
.footer li a{transition:opacity .2s,transform .25s;display:inline-block;}
@media(prefers-reduced-motion:no-preference){
.footer li a:hover{transform:translateX(4px);}
}
/* category / filter pills */
.catbar a,.noresult__tips a{transition:background .25s,border-color .25s,color .25s,transform .25s;}
@media(prefers-reduced-motion:no-preference){
.catbar a:hover,.noresult__tips a:hover{transform:translateY(-2px);}
}
/* logo wall: lift the hovered mark */
.logos__group img{transition:transform .3s ease,filter .3s ease;}
/* section headings fade their sub-line in just after the title */
@supports (animation-timeline: view()){
@media(prefers-reduced-motion:no-preference){
.section__head p{animation:gkFade .8s ease .12s both;
animation-timeline:view();animation-range:entry 0% entry 50%;}
}
}
/* <<<<< PARALLAX CTA + MOTION CSS <<<<< */
/* >>>>> MEGA MENU CSS >>>>> */
/* ============================================================
MEGA MENU
============================================================ */
/* the panel is absolute against .header so it can span the full width,
while :hover / :focus-within on the wrapper drives it - no JavaScript */
.header{position:relative;z-index:60;}
.has-mega{position:static;display:flex;align-items:center;}
.mega{position:absolute;left:0;right:0;top:100%;z-index:70;
background:var(--red);color:#fff;
opacity:0;visibility:hidden;transform:translateY(-10px);
transition:opacity .26s ease,transform .26s ease,visibility .26s;}
.has-mega:hover .mega,
.has-mega:focus-within .mega{opacity:1;visibility:visible;transform:none;}
/* keeps the pointer from falling through the gap under the link */
.has-mega::after{content:"";position:absolute;left:0;right:0;top:100%;height:14px;}
.mega__inner{max-width:var(--maxw);margin:0 auto;padding:34px 24px 38px;
display:grid;grid-template-columns:repeat(4,1fr) 1.25fr;gap:30px;}
.mega__col h4{font-family:var(--font-body);font-size:13px;font-weight:500;
letter-spacing:1.6px;text-transform:uppercase;color:#FCC304;
padding-bottom:12px;margin-bottom:6px;border-bottom:1px solid rgba(255,255,255,.28);}
.mega__col a{display:block;padding:7px 0;font-size:14px;font-weight:300;color:#fff;
opacity:.92;transition:opacity .2s,transform .25s;}
.mega__col a:hover{opacity:1;transform:translateX(4px);text-decoration:underline;}
.mega__cards{display:grid;grid-template-rows:1fr 1fr;gap:14px;}
.megacard{position:relative;border-radius:var(--card-radius);overflow:hidden;
min-height:132px;display:block;}
.megacard img{width:100%;height:100%;object-fit:cover;position:absolute;inset:0;
transition:transform .5s ease;}
.megacard:hover img{transform:scale(1.06);}
/* these photos are bright and busy, so the scrim has to be strong */
.megacard__cap{position:relative;z-index:2;height:100%;display:flex;flex-direction:column;
justify-content:flex-end;padding:16px 18px;
background:linear-gradient(to top,rgba(0,0,0,.88),rgba(0,0,0,.48) 52%,rgba(0,0,0,.12));}
.megacard__cap span{display:block;font-size:11px;letter-spacing:1.3px;
text-transform:uppercase;color:#FCC304;margin-bottom:4px;}
/* colour set explicitly - a broader rule elsewhere was tinting these teal */
.megacard__cap b{display:block;color:#fff;font-family:var(--font-head);
font-size:18px;font-weight:400;line-height:1.25;
text-shadow:0 2px 6px rgba(0,0,0,.8);}
.mega__all{grid-column:1/-1;margin-top:6px;padding-top:18px;
border-top:1px solid rgba(255,255,255,.24);
display:flex;justify-content:space-between;align-items:center;gap:14px;flex-wrap:wrap;}
.mega__all span{font-size:13px;font-weight:300;opacity:.9;}
.mega__all a{font-size:12px;letter-spacing:1.6px;text-transform:uppercase;
border:1px solid rgba(255,255,255,.6);border-radius:var(--btn-radius);
padding:10px 22px;transition:.22s;}
.mega__all a:hover{background:#fff;color:var(--red);border-color:#fff;}
@media(max-width:1100px){
.mega__inner{grid-template-columns:repeat(3,1fr);}
.mega__cards{grid-column:1/-1;grid-template-rows:none;grid-template-columns:1fr 1fr;}
}
@media(max-width:900px){
/* hover menus do not work on touch - Shop just links to the shop page */
.mega{display:none;}
.has-mega::after{display:none;}
}
@media(prefers-reduced-motion:reduce){
.mega{transition:none;}
.mega__col a:hover,.megacard:hover img{transform:none;}
}
/* <<<<< MEGA MENU CSS <<<<< */
/* >>>>> HEADER SEARCH CSS >>>>> */
/* ============================================================
HEADER SEARCH PANEL
============================================================ */
.search-toggle{position:absolute;width:1px;height:1px;opacity:0;pointer-events:none;}
.searchov{position:fixed;inset:0;background:rgba(0,0,0,.35);z-index:55;cursor:pointer;
opacity:0;visibility:hidden;transition:opacity .25s ease,visibility .25s;}
.searchpanel{position:absolute;left:0;right:0;top:100%;z-index:65;
background:var(--blush);border-top:1px solid rgba(5,81,77,.14);
box-shadow:0 16px 34px rgba(90,45,30,.13);
opacity:0;visibility:hidden;transform:translateY(-12px);
transition:opacity .26s ease,transform .26s ease,visibility .26s;}
#gk-search:checked~.searchov{opacity:1;visibility:visible;}
#gk-search:checked~.searchpanel{opacity:1;visibility:visible;transform:none;}
.searchpanel__inner{max-width:760px;margin:0 auto;padding:30px 24px 34px;position:relative;}
.searchpanel__hint{font-size:11px;letter-spacing:2px;text-transform:uppercase;
color:var(--teal);opacity:.65;margin-bottom:12px;}
.searchpanel .searchform{margin:0;max-width:none;}
/* z-index so the hint paragraph next to it cannot swallow the click */
.searchclose{position:absolute;right:16px;top:16px;z-index:3;
width:34px;height:34px;border-radius:50%;
display:flex;align-items:center;justify-content:center;cursor:pointer;
border:1px solid rgba(5,81,77,.28);transition:.2s;}
.searchclose:hover{background:var(--red);border-color:var(--red);}
.searchclose svg{width:14px;height:14px;stroke:var(--teal);fill:none;
stroke-width:2.2;stroke-linecap:round;}
.searchclose:hover svg{stroke:#fff;}
.searchpanel__quick{display:flex;flex-wrap:wrap;gap:8px;margin-top:16px;}
.searchpanel__quick span{font-size:12px;color:var(--teal);opacity:.7;
align-self:center;margin-right:4px;}
.searchpanel__quick a{border:1px solid rgba(5,81,77,.26);border-radius:999px;
padding:6px 15px;font-size:13px;color:var(--teal);transition:.2s;}
.searchpanel__quick a:hover{border-color:var(--teal);}
@media(max-width:600px){
.searchpanel__inner{padding:22px 16px 26px;}
.searchclose{top:10px;right:10px;}
}
/* <<<<< HEADER SEARCH CSS <<<<< */
/* >>>>> LANDING + QUOTE POPUP CSS >>>>> */
/* ============================================================
QUOTE POPUP
============================================================ */
.qtoggle{position:absolute;width:1px;height:1px;opacity:0;pointer-events:none;}
.qmodal{position:fixed;inset:0;z-index:100;display:flex;align-items:center;
justify-content:center;padding:24px;
opacity:0;visibility:hidden;transition:opacity .28s ease,visibility .28s;}
.qmodal__ov{position:absolute;inset:0;background:rgba(0,0,0,.58);cursor:pointer;}
.qmodal__box{position:relative;z-index:2;width:min(580px,100%);max-height:88vh;
overflow-y:auto;background:var(--red);color:#fff;
border-radius:var(--panel-radius);padding:36px 34px 38px;
transform:translateY(18px);transition:transform .32s cubic-bezier(.2,.7,.3,1);}
#gk-quote:checked~.qmodal{opacity:1;visibility:visible;}
#gk-quote:checked~.qmodal .qmodal__box{transform:none;}
.qmodal h2{font-family:var(--font-head);font-size:30px;font-weight:400;line-height:1.15;}
.qmodal__sub{color:#FCC304;font-size:13px;margin:8px 0 22px;font-weight:300;line-height:1.6;}
.qmodal__item{display:flex;gap:12px;align-items:center;background:rgba(0,0,0,.16);
border-radius:var(--btn-radius);padding:10px 12px;margin-bottom:20px;}
.qmodal__item img{width:52px;height:52px;object-fit:cover;border-radius:8px;flex:0 0 auto;}
.qmodal__item span{font-size:13px;font-weight:300;line-height:1.45;}
.qclose{position:absolute;right:14px;top:14px;z-index:3;width:34px;height:34px;
border-radius:50%;display:flex;align-items:center;justify-content:center;cursor:pointer;
border:1px solid rgba(255,255,255,.5);transition:.2s;}
.qclose:hover{background:#fff;}
.qclose svg{width:14px;height:14px;stroke:#fff;fill:none;stroke-width:2.2;stroke-linecap:round;}
.qclose:hover svg{stroke:var(--red);}
/* product page: two actions side by side */
.pdp__actions{display:flex;gap:12px;flex-wrap:wrap;margin-top:24px;}
.pdp__actions .quote{margin-top:0;}
.quote--ghost{background:transparent;border:1px solid rgba(255,255,255,.9);}
.pdp .quote--ghost{border-color:var(--red);color:var(--red);}
.pdp .quote--ghost svg{fill:var(--red);}
.pdp .quote--ghost:hover{background:var(--red);color:#fff;}
.pdp .quote--ghost:hover svg{fill:#fff;}
/* confirmation shown after a quote form posts */
.gk-notice{border-radius:var(--btn-radius);padding:12px 16px;margin:0 0 18px;
font-size:14px;font-weight:300;}
.gk-notice--ok{background:#0f6e56;color:#fff;}
.gk-notice--bad{background:#FCC304;color:var(--ink);}
.askbox .gk-notice--ok{background:#fff;color:var(--red);}
/* ============================================================
SEO CONTENT BLOCK
============================================================ */
.seoblock{background:var(--blush);padding:54px 0 60px;}
.seoblock__grid{display:grid;grid-template-columns:1.15fr 1fr;gap:46px;align-items:center;}
.seoblock h2{font-family:var(--font-head);color:var(--teal);font-size:34px;
font-weight:400;line-height:1.22;}
.seoblock__body p{font-size:15px;line-height:1.9;color:#4a4a4a;font-weight:300;margin-top:16px;}
.seoblock__body h3{font-family:var(--font-head);color:var(--teal);font-size:20px;
font-weight:400;margin-top:22px;}
.seoblock__body ul{margin:12px 0 0 20px;}
.seoblock__body li{font-size:15px;line-height:1.9;color:#4a4a4a;font-weight:300;}
.seoblock__body a{color:var(--red);border-bottom:1px solid var(--red);}
.seoblock__media img{width:100%;height:clamp(280px,32vw,420px);object-fit:cover;
border-radius:var(--panel-radius);display:block;}
/* ============================================================
LANDING PAGES
============================================================ */
.lhero{background:var(--red);color:#fff;padding:56px 0 60px;}
.lhero__grid{display:grid;grid-template-columns:1.1fr 1fr;gap:44px;align-items:center;}
.lhero__eyebrow{font-size:12px;letter-spacing:2.6px;text-transform:uppercase;color:#FCC304;}
.lhero h1{font-family:var(--font-head);font-size:clamp(30px,4vw,46px);
font-weight:400;line-height:1.15;margin-top:12px;}
.lhero p{font-size:16px;line-height:1.8;font-weight:300;margin-top:16px;}
.lhero__btns{display:flex;gap:12px;flex-wrap:wrap;margin-top:28px;}
.lhero__btns .btn{margin-top:0;}
/* the hero is red, so the primary button flips to cream - a red solid button
would disappear into the background */
.lhero__btns .btn--solid{background:#fff;border-color:#fff;color:var(--red);}
.lhero__btns .btn--solid:hover{background:#FCC304;border-color:#FCC304;color:var(--ink);}
.lhero__media img{width:100%;height:clamp(260px,30vw,400px);object-fit:cover;
border-radius:var(--panel-radius);display:block;}
.lbenefits{padding:52px 0 10px;}
.lbenefits__grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;}
.lbenefit{background:#fff;border-radius:var(--card-radius);padding:28px 26px;}
.lbenefit svg{width:30px;height:30px;stroke:var(--red);fill:none;stroke-width:1.5;
stroke-linecap:round;stroke-linejoin:round;}
.lbenefit h3{font-family:var(--font-head);color:var(--teal);font-size:20px;
font-weight:400;margin-top:14px;}
.lbenefit p{font-size:14px;line-height:1.8;color:#5c5c5c;font-weight:300;margin-top:8px;}
.lprose{padding:44px 0 20px;}
.lprose__inner{max-width:820px;margin:0 auto;padding:0 24px;}
.lprose h2{font-family:var(--font-head);color:var(--teal);font-size:30px;
font-weight:400;margin:32px 0 12px;line-height:1.25;}
.lprose h3{font-family:var(--font-head);color:var(--teal);font-size:21px;
font-weight:400;margin:24px 0 10px;}
.lprose p{font-size:16px;line-height:1.9;color:#3f3f3f;font-weight:300;margin-bottom:18px;}
.lprose ul,.lprose ol{margin:0 0 20px 22px;}
.lprose li{font-size:16px;line-height:1.9;color:#3f3f3f;font-weight:300;margin-bottom:6px;}
.lprose blockquote{border-left:3px solid var(--red);padding:4px 0 4px 22px;margin:26px 0;
font-family:var(--font-head);font-size:20px;line-height:1.5;color:var(--teal);}
.lprose img{width:100%;border-radius:var(--card-radius);margin:24px 0;}
.lprose a{color:var(--red);border-bottom:1px solid var(--red);}
.ltoc{background:#fff;border-radius:var(--card-radius);padding:22px 24px;margin-bottom:28px;}
.ltoc p{font-size:11px;letter-spacing:2px;text-transform:uppercase;color:var(--red);
margin-bottom:10px;}
.ltoc a{display:block;padding:7px 0;font-size:14px;color:var(--teal);font-weight:300;
border-bottom:1px solid rgba(5,81,77,.09);}
.ltoc a:last-child{border-bottom:none;}
.ltoc a:hover{color:var(--red);}
@media(max-width:900px){
.seoblock__grid,.lhero__grid{grid-template-columns:1fr;gap:26px;}
.seoblock__media{order:-1;}
.lbenefits__grid{grid-template-columns:1fr;}
}
@media(max-width:600px){
.qmodal{padding:14px;}
.qmodal__box{padding:28px 22px 30px;}
.qmodal h2{font-size:23px;}
.pdp__actions .quote{width:100%;justify-content:center;}
.seoblock h2{font-size:25px;}
}
/* <<<<< LANDING + QUOTE POPUP CSS <<<<< */
/* >>>>> EDITOR CONTENT CSS >>>>> */
/* Editor content on plain pages (page.php -> .entry).
Whatever the client builds in the editor lands here, including markup
carried over from the old page builder. A bare