:root { --ink:#151716; --paper:#f6f5f1; --muted:#656861; --line:#dcded7; --red:#bf2027; --red-dark:#97161c; --lime:#d6e447; --night:#202622; --radius:1.35rem; --shell:1200px; }
* { box-sizing:border-box; } html { scroll-behavior:smooth; } body { margin:0; color:var(--ink); background:var(--paper); font-family:Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif; font-size:16px; line-height:1.55; } img { max-width:100%; display:block; } a { color:inherit; text-decoration:none; } .shell { width:min(calc(100% - 3rem), var(--shell)); margin:auto; } .sr-only { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0; }.skip-link { position:fixed; left:1rem; top:-5rem; z-index:20; padding:.7rem 1rem; border-radius:.5rem; background:var(--ink); color:white; }.skip-link:focus { top:1rem; }
.site-header { position:absolute; z-index:10; left:0; right:0; top:0; color:#fff; }.nav-wrap { min-height:82px; display:flex; align-items:center; gap:1rem; flex-wrap:nowrap; }.brand { flex:0 0 auto; display:inline-flex; align-items:center; gap:.6rem; font-size:.82rem; font-weight:800; letter-spacing:.08em; order:1; }.brand img { width:auto; height:42px; object-fit:contain; background:transparent; mix-blend-mode:normal; filter:brightness(1.18) saturate(1.04) contrast(1.04) drop-shadow(0 2px 5px rgba(0,0,0,.12)); }.brand > span > span { font-weight:500; }.primary-nav { flex:1 1 auto; display:flex; flex-wrap:wrap; align-items:center; justify-content:center; gap:.35rem; font-size:.89rem; order:2; }.header-controls { flex:0 0 auto; display:flex; align-items:center; margin-left:auto; gap:.65rem; order:3; }.language-switch { display:flex; padding:3px; border:1px solid rgba(255,255,255,.18); border-radius:99px; background:rgba(8,16,18,.28); backdrop-filter:blur(12px); }.primary-nav > a:not(.button) { display:inline-flex; align-items:center; justify-content:center; min-width:112px; min-height:2.45rem; padding:.45rem .85rem; border-radius:99px; text-align:center; white-space:normal; line-height:1.15; opacity:.82; transition:background .2s ease, color .2s ease, opacity .2s ease, transform .2s ease; }.primary-nav > a:not(.button):hover { opacity:1; background:rgba(255,255,255,.13); }.primary-nav > a:not(.button).active-tab { color:#fff; opacity:1; background:rgba(255,255,255,.19); box-shadow:inset 0 0 0 1px rgba(255,255,255,.09); }.button { display:inline-flex; align-items:center; justify-content:center; gap:.5rem; padding:.85rem 1.2rem; border:1px solid var(--red); border-radius:99px; color:white; background:var(--red); font-size:.88rem; font-weight:700; transition:transform .2s ease, background .2s ease; }.button:hover { transform:translateY(-2px); background:var(--red-dark); }.button-small { padding:.55rem 1rem; }.menu-toggle { display:none; }
.hero { position:relative; overflow:hidden; min-height:730px; padding:175px 0 90px; color:#fff; background:radial-gradient(circle at 69% 8%, rgba(255,255,255,.24), transparent 28%), linear-gradient(90deg, rgba(4,41,60,.24) 0%, rgba(4,41,60,.12) 35%, rgba(4,41,60,0) 67%), url("assets/akshaya-hero-cool-roof.png") center/cover; }.hero::after { content:""; position:absolute; inset:0; background:linear-gradient(0deg, rgba(4,29,43,.25), transparent 42%); pointer-events:none; }.hero-grid { position:relative; z-index:1; display:grid; grid-template-columns:1.04fr .96fr; gap:3rem; align-items:center; }.hero-grid-banner { display:block; }.hero-copy { max-width:690px; }.eyebrow { margin:0 0 1rem; color:var(--red); font-size:.73rem; font-weight:800; letter-spacing:.13em; text-transform:uppercase; }.hero .eyebrow { color:var(--lime); }.hero h1, h2, h3, p { margin-top:0; }.hero h1 { max-width:650px; margin-bottom:1.3rem; font-size:clamp(3.3rem, 6.5vw, 6.2rem); letter-spacing:-.075em; line-height:.94; }.hero-intro { max-width:530px; margin-bottom:2rem; color:rgba(255,255,255,.9); font-size:1.12rem; }.button-group { display:flex; align-items:center; gap:1.3rem; }.text-link { display:inline-flex; align-items:center; gap:.45rem; color:var(--red); font-size:.9rem; font-weight:750; }.text-link:hover span, .card-link:hover span { transform:translateX(3px); }.text-link span, .card-link span { transition:transform .2s ease; }.hero .text-link { color:#fff; }.hero-caption { margin:3.3rem 0 0; color:rgba(255,255,255,.82); font-size:.72rem; }.hero-caption span { display:inline-block; width:20px; height:1px; margin:0 .5rem .25rem 0; background:var(--lime); }
.section { padding:clamp(5rem, 10vw, 9rem) 0; }.section-heading { max-width:660px; margin-bottom:3.4rem; }.section-heading h2, .story h2, .contact h2 { margin-bottom:1rem; font-size:clamp(2.35rem,4.5vw,4.5rem); letter-spacing:-.065em; line-height:.98; }.section-heading > p:last-child { max-width:570px; color:var(--muted); }.product-grid { display:grid; grid-template-columns:1.2fr .8fr; gap:1rem; }.product-card { position:relative; min-height:350px; overflow:hidden; padding:2.2rem; border-radius:var(--radius); }.product-card-featured { display:flex; grid-row:span 2; min-height:716px; color:#fff; background:#b62428; }.product-card-dark { color:#fff; background:var(--night); }.product-card-soft { background:#e8e9df; }.product-card-copy { position:relative; z-index:2; max-width:300px; }.card-kicker { margin-bottom:.85rem; font-size:.72rem; font-weight:800; letter-spacing:.11em; text-transform:uppercase; opacity:.7; }.product-card h3 { max-width:360px; margin-bottom:.7rem; font-size:clamp(1.7rem, 3vw, 2.7rem); letter-spacing:-.055em; line-height:1; }.product-card-copy > p:not(.card-kicker) { font-size:.93rem; opacity:.78; }.card-link { display:inline-flex; align-items:center; gap:.4rem; margin-top:1rem; color:inherit; font-size:.83rem; font-weight:800; }.product-card img { position:absolute; right:7%; bottom:5%; max-height:71%; object-fit:contain; filter:drop-shadow(0 22px 14px rgba(0,0,0,.16)); transition:transform .4s ease; }.product-card:hover img { transform:translateY(-8px) rotate(2deg); }.product-card-featured img { right:13%; bottom:7%; max-height:60%; }.product-card-soft img { max-height:73%; right:9%; }.product-strip { display:flex; flex-wrap:wrap; gap:.65rem; margin-top:1.2rem; }.product-strip span { padding:.54rem .8rem; border:1px solid var(--line); border-radius:99px; color:var(--muted); font-size:.78rem; }
.roof-coat { background:#fff; }.roof-compare { position:relative; overflow:hidden; min-height:440px; border-radius:var(--radius); background:#d9e4e5; }.roof-compare img { width:100%; height:clamp(440px,48vw,620px); object-fit:cover; }.compare-label { position:absolute; top:1.2rem; display:flex; flex-direction:column; gap:.1rem; padding:.75rem 1rem; border-radius:.8rem; color:#fff; font-size:.75rem; background:rgba(15,20,18,.78); backdrop-filter:blur(8px); }.compare-label span { opacity:.7; font-weight:700; text-transform:uppercase; letter-spacing:.08em; }.compare-label strong { font-size:.9rem; }.label-hot { left:1.2rem; }.label-cool { right:1.2rem; background:rgba(18,91,72,.84); }.benefit-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:1rem; margin-top:1rem; }.benefit { padding:1.5rem; border:1px solid var(--line); border-radius:1rem; }.benefit-icon { display:grid; width:2.2rem; height:2.2rem; margin-bottom:2.3rem; place-items:center; border-radius:50%; color:#fff; background:var(--red); font-weight:800; }.benefit:nth-child(2) .benefit-icon { background:#16804d; }.benefit:nth-child(3) .benefit-icon { background:#1374a8; }.benefit:nth-child(4) .benefit-icon { color:var(--ink); background:var(--lime); }.benefit h3 { margin-bottom:.55rem; font-size:1.08rem; letter-spacing:-.035em; line-height:1.05; }.benefit p { margin-bottom:0; color:var(--muted); font-size:.85rem; }.savings-grid { display:grid; grid-template-columns:1fr 1fr; gap:clamp(2.5rem,10vw,10rem); align-items:center; }.savings .eyebrow { color:var(--lime); }.savings-copy h2 { max-width:570px; font-size:clamp(2.35rem,4.5vw,4.5rem); letter-spacing:-.065em; line-height:.98; }.savings-copy > p:not(.eyebrow) { max-width:480px; color:rgba(255,255,255,.68); }.check-list { display:grid; gap:.55rem; padding:0; margin:1.8rem 0 0; list-style:none; color:rgba(255,255,255,.85); font-size:.9rem; }.check-list li::before { content:"✓"; display:inline-grid; width:1.25rem; height:1.25rem; margin-right:.65rem; place-items:center; border-radius:50%; color:var(--night); background:var(--lime); font-size:.75rem; font-weight:900; }.savings-card { padding:clamp(1.5rem,4vw,2.6rem); border-radius:var(--radius); background:#fff; color:var(--ink); }.savings-card label { display:flex; justify-content:space-between; margin:1.1rem 0 .45rem; font-size:.8rem; font-weight:800; }.savings-card label:first-child { margin-top:0; }.savings-card label span { color:var(--muted); font-weight:600; }.savings-card label em { font-style:normal; }.savings-card input { width:100%; padding:.85rem 1rem; border:1px solid var(--line); border-radius:.55rem; outline:none; color:var(--ink); background:#fbfbf8; font:inherit; }.savings-card input:focus { border-color:var(--red); box-shadow:0 0 0 3px rgba(191,32,39,.12); }.savings-card .button { width:100%; margin-top:1.35rem; }.savings-result { display:block; min-height:3.5rem; margin-top:1.2rem; color:#147046; font-size:1rem; font-weight:800; line-height:1.35; }.fine-print { margin:0; color:var(--muted); font-size:.7rem; line-height:1.45; }
.section-dark { color:#fff; background:var(--night); }.story { position:relative; isolation:isolate; overflow:hidden; background:radial-gradient(circle at 87% 9%, rgba(57,125,151,.48), transparent 25%), radial-gradient(circle at 9% 100%, rgba(183,36,40,.34), transparent 31%), linear-gradient(132deg,#101d20 0%,#132f35 48%,#102027 100%); }.story::before { content:""; position:absolute; z-index:-1; inset:0; opacity:.5; background:linear-gradient(90deg,rgba(255,255,255,.045) 1px,transparent 1px), linear-gradient(rgba(255,255,255,.035) 1px,transparent 1px); background-size:36px 36px; mask-image:linear-gradient(110deg,#000,transparent 75%); }.story::after { content:""; position:absolute; z-index:-1; top:8%; right:-8rem; width:21rem; aspect-ratio:1; border:1px solid rgba(216,242,119,.22); border-radius:50%; box-shadow:0 0 0 2.7rem rgba(216,242,119,.035), 0 0 0 5.4rem rgba(216,242,119,.02); }.story-intro { display:grid; grid-template-columns:1.35fr .65fr; gap:clamp(2rem,8vw,9rem); align-items:end; }.story-copy { max-width:760px; }.story-copy .eyebrow { color:var(--lime); }.story h2 { max-width:760px; margin-bottom:1.35rem; font-size:clamp(3rem,6vw,5.8rem); letter-spacing:-.075em; line-height:.91; }.story-lede { max-width:710px; margin-bottom:0; color:rgba(255,255,255,.9); font-size:clamp(1.05rem,1.5vw,1.28rem); line-height:1.55; }.story-statement { padding:1.35rem 0 1.2rem 1.4rem; border-left:2px solid var(--lime); }.story-statement span { display:block; margin-bottom:.7rem; color:var(--lime); font-size:.72rem; font-weight:850; letter-spacing:.12em; text-transform:uppercase; }.story-statement p { margin:0; color:rgba(255,255,255,.76); font-size:.93rem; line-height:1.5; }.story-narrative { display:grid; grid-template-columns:1fr 1fr; gap:clamp(1.5rem,6vw,5rem); max-width:1050px; margin:clamp(2.8rem,6vw,5rem) 0 2.2rem; }.story-narrative p { margin:0; color:rgba(255,255,255,.72); font-size:.98rem; line-height:1.7; }.story-commitments { display:grid; grid-template-columns:repeat(2,1fr); gap:1rem; }.story-commitment { position:relative; min-height:240px; padding:1.6rem; overflow:hidden; border:1px solid rgba(255,255,255,.16); border-radius:1.1rem; background:linear-gradient(145deg,rgba(255,255,255,.1),rgba(255,255,255,.035)); box-shadow:inset 0 1px 0 rgba(255,255,255,.09); }.story-commitment::after { content:""; position:absolute; right:-1.2rem; bottom:-1.8rem; width:6rem; aspect-ratio:1; border:1px solid rgba(216,242,119,.3); border-radius:50%; }.story-commitment > span { color:var(--lime); font-size:.72rem; font-weight:850; letter-spacing:.1em; }.story-commitment h3 { position:relative; z-index:1; margin:2.8rem 0 .7rem; font-size:clamp(1.35rem,2.2vw,1.8rem); letter-spacing:-.055em; line-height:1; }.story-commitment p { position:relative; z-index:1; max-width:460px; margin:0; color:rgba(255,255,255,.71); font-size:.88rem; line-height:1.55; }.text-link-light { margin-top:1rem; color:var(--lime); }.story-link { margin-top:1.8rem; }.centered { margin-right:auto; margin-left:auto; text-align:center; }.principles { display:grid; grid-template-columns:repeat(3,1fr); border-top:1px solid var(--line); }.principle { padding:2.1rem 2rem 1rem 0; border-right:1px solid var(--line); }.principle + .principle { padding-left:2rem; }.principle:last-child { border:0; }.principle span { color:var(--red); font-size:.75rem; font-weight:800; }.principle h3 { margin:2.2rem 0 .7rem; font-size:1.28rem; letter-spacing:-.04em; }.principle p { color:var(--muted); font-size:.9rem; }
.contact { padding-bottom:5rem; }.contact-panel { display:flex; align-items:flex-end; justify-content:space-between; gap:2rem; padding:clamp(2rem,5vw,4.2rem); border-radius:var(--radius); background:var(--lime); }.contact-panel h2 { max-width:600px; }.contact-panel > div > p:last-child { max-width:480px; color:#38402f; }.contact-actions { display:flex; flex-direction:column; align-items:flex-start; gap:1.1rem; white-space:nowrap; }.contact-actions .button { background:var(--ink); border-color:var(--ink); }.contact-actions .button:hover { background:#363a35; }.site-footer { padding:4rem 0 1.4rem; color:rgba(255,255,255,.7); background:#151716; }.footer-grid { display:grid; grid-template-columns:2fr 1fr 1fr; gap:3rem; padding-bottom:3.2rem; }.brand-footer { color:#fff; }.footer-brand > p, .footer-grid p { margin-top:.8rem; font-size:.84rem; }.footer-grid a { display:block; margin-top:.35rem; font-size:.84rem; }.footer-grid a:hover { color:#fff; }.footer-label { color:#fff; font-size:.72rem !important; font-weight:800; letter-spacing:.11em; text-transform:uppercase; }.footer-bottom { display:flex; justify-content:space-between; padding-top:1.4rem; border-top:1px solid rgba(255,255,255,.13); font-size:.75rem; }.footer-bottom a:hover { color:#fff; }
.infrastructure-grid { display:grid; grid-template-columns:.8fr 1.2fr; gap:clamp(2.5rem,7vw,7rem); align-items:center; }.infrastructure-copy { max-width:450px; }.infrastructure-copy .eyebrow { color:var(--lime); }.infrastructure-copy h2 { font-size:clamp(2.35rem,4.5vw,4.5rem); letter-spacing:-.065em; line-height:.98; }.infrastructure-copy > p:not(.eyebrow) { color:rgba(255,255,255,.68); }.infrastructure-points { display:grid; gap:.85rem; margin:1.5rem 0 1.6rem; }.infrastructure-points div { padding:.95rem 1rem; border:1px solid rgba(255,255,255,.12); border-radius:1rem; background:rgba(255,255,255,.04); }.infrastructure-points strong { display:block; margin-bottom:.25rem; color:#fff; font-size:.92rem; }.infrastructure-points span { color:rgba(255,255,255,.67); font-size:.82rem; }.infrastructure-gallery { display:grid; gap:.8rem; }.gallery-hero { position:relative; overflow:hidden; border-radius:var(--radius); }.gallery-main { width:100%; height:420px; object-fit:cover; border-radius:var(--radius); }.gallery-caption { position:absolute; left:1rem; bottom:1rem; max-width:260px; padding:.85rem 1rem; border:1px solid rgba(255,255,255,.2); border-radius:1rem; color:#fff; background:rgba(13,17,15,.7); backdrop-filter:blur(8px); }.gallery-caption span { display:block; margin-bottom:.15rem; color:rgba(255,255,255,.72); font-size:.7rem; font-weight:800; letter-spacing:.08em; text-transform:uppercase; }.gallery-caption strong { font-size:.98rem; line-height:1.2; }.gallery-thumbs { display:grid; grid-template-columns:repeat(4,1fr); gap:.8rem; }.gallery-thumbs img { width:100%; height:120px; object-fit:cover; border-radius:.9rem; border:1px solid rgba(255,255,255,.12); }.certificates-grid { display:grid; grid-template-columns:1fr 1fr; gap:clamp(2rem,8vw,8rem); align-items:center; }.certificate-card { display:grid; grid-template-columns:150px 1fr; gap:1.6rem; align-items:center; padding:1.2rem; border:1px solid var(--line); border-radius:var(--radius); background:#fff; }.certificate-card img { width:150px; height:170px; object-fit:cover; border-radius:.75rem; }.certificate-card h3 { margin-bottom:1rem; font-size:1.35rem; letter-spacing:-.045em; line-height:1.05; }.certificate-card .card-link { display:flex; margin-top:.55rem; color:var(--red); }
.application { background:#eceee5; }.application-steps { display:grid; grid-template-columns:repeat(5,1fr); border-top:1px solid #cbd0c4; }.application-steps article { padding:1.4rem 1.2rem 0 0; }.application-steps article + article { padding-left:1.2rem; border-left:1px solid #cbd0c4; }.application-steps span { display:grid; width:2rem; height:2rem; margin-bottom:2.5rem; place-items:center; border-radius:50%; color:#fff; background:var(--red); font-size:.73rem; font-weight:800; }.application-steps h3 { margin-bottom:.45rem; font-size:1.15rem; letter-spacing:-.04em; }.application-steps p { color:var(--muted); font-size:.84rem; }.dealer { padding-top:0; }.dealer-panel { display:flex; align-items:center; justify-content:space-between; gap:2rem; padding:clamp(2rem,5vw,4rem); border-radius:var(--radius); color:#fff; background:linear-gradient(130deg,#a21820,#57161a); }.dealer-panel .eyebrow { color:#ffd34e; }.dealer-panel h2 { max-width:650px; margin-bottom:.8rem; font-size:clamp(2.2rem,4vw,4rem); letter-spacing:-.065em; line-height:.98; }.dealer-panel p:not(.eyebrow) { max-width:660px; margin-bottom:0; color:rgba(255,255,255,.76); }.dealer-actions { display:flex; flex-direction:column; align-items:flex-start; gap:1rem; white-space:nowrap; }.dealer-actions .button { color:var(--ink); border-color:#fff; background:#fff; }.dealer-actions .text-link { color:#fff; }
.reveal { animation:rise .7s both; }.reveal:nth-child(2) { animation-delay:.08s; }.reveal:nth-child(3) { animation-delay:.16s; } @keyframes rise { from { opacity:0; transform:translateY(15px); } to { opacity:1; transform:translateY(0); } } @media (prefers-reduced-motion:reduce) { *, *::before, *::after { scroll-behavior:auto !important; animation-duration:.01ms !important; transition-duration:.01ms !important; } }
@media (max-width:760px) { .shell { width:min(calc(100% - 2rem),var(--shell)); }.nav-wrap { min-height:70px; }.primary-nav { position:absolute; top:70px; left:1rem; right:1rem; display:none; align-items:stretch; gap:.35rem; padding:.7rem; border:1px solid rgba(255,255,255,.16); border-radius:1rem; background:rgba(26,30,27,.96); box-shadow:0 16px 35px rgba(0,0,0,.24); }.primary-nav.open { display:flex; flex-direction:column; }.primary-nav a:not(.button) { width:100%; min-width:0; justify-content:flex-start; padding:.8rem .7rem; }.primary-nav .button { margin:.35rem .15rem 0; width:calc(100% - .3rem); }.menu-toggle { display:grid; gap:5px; width:40px; height:40px; place-content:center; border:1px solid rgba(255,255,255,.38); border-radius:50%; background:transparent; }.menu-toggle i { display:block; width:14px; height:1px; background:#fff; }.hero { min-height:690px; padding-top:145px; background-position:58% center; }.hero h1 { font-size:clamp(3.25rem,15vw,4.5rem); }.hero-grid, .story-grid, .infrastructure-grid, .certificates-grid, .savings-grid { grid-template-columns:1fr; gap:2.2rem; }.product-grid, .benefit-grid { grid-template-columns:1fr; }.roof-compare, .roof-compare img { min-height:300px; height:300px; }.compare-label { top:auto; bottom:.8rem; padding:.55rem .7rem; }.label-hot { left:.8rem; }.label-cool { right:.8rem; }.product-card-featured { grid-row:auto; min-height:530px; }.product-card { min-height:390px; }.product-card-featured img { max-height:53%; }.section-heading { margin-bottom:2.2rem; }.story-image, .story-image img { min-height:330px; }.principles, .footer-grid, .application-steps { grid-template-columns:1fr; }.principle, .principle + .principle { padding:1.5rem 0; border-right:0; border-bottom:1px solid var(--line); }.principle h3 { margin:1.1rem 0 .5rem; }.application-steps article, .application-steps article + article { padding:1.2rem 0; border-left:0; border-bottom:1px solid #cbd0c4; }.application-steps span { margin-bottom:1rem; }.infrastructure-gallery { min-height:330px; }.gallery-main { height:310px; }.gallery-thumbs { grid-template-columns:repeat(2,1fr); }.gallery-thumbs img { height:110px; }.certificate-card { grid-template-columns:110px 1fr; gap:1rem; }.certificate-card img { width:110px; height:145px; }.dealer-panel, .contact-panel { align-items:flex-start; flex-direction:column; }.footer-grid { gap:1.4rem; }.footer-bottom { gap:1rem; }.contact { padding-bottom:3rem; } }

/* Final responsive and interactive UI layer */
.site-header { backdrop-filter:blur(18px); }.nav-wrap { gap:1rem; }.header-controls { display:flex; align-items:center; gap:.65rem; }.language-switch { display:flex; padding:3px; border:1px solid rgba(255,255,255,.18); border-radius:99px; background:rgba(8,16,18,.28); backdrop-filter:blur(12px); }.language-button { min-width:36px; padding:.3rem .5rem; border:0; border-radius:99px; color:rgba(255,255,255,.78); background:transparent; font:700 .67rem/1 inherit; cursor:pointer; transition:background .2s ease, color .2s ease, transform .2s ease; }.language-button:hover { transform:translateY(-1px); }.language-button.active { color:#061116; background:linear-gradient(180deg,#f7fbff 0%,#d9f2ff 100%); box-shadow:0 8px 22px rgba(92,197,255,.25); }.primary-nav { gap:.5rem; padding:.6rem .7rem; border:1px solid rgba(255,255,255,.16); border-radius:999px; background:linear-gradient(135deg, rgba(17,26,23,.76) 0%, rgba(15,69,115,.55) 55%, rgba(22,24,23,.6) 100%); backdrop-filter:blur(20px) saturate(140%); box-shadow:0 18px 40px rgba(0,0,0,.2), inset 0 1px 0 rgba(255,255,255,.09); }.primary-nav > a:not(.button) { position:relative; isolation:isolate; display:inline-flex; align-items:center; justify-content:center; min-width:108px; min-height:2.9rem; padding:.56rem .95rem; border:1px solid transparent; border-radius:999px; color:rgba(255,255,255,.9); text-align:center; white-space:normal; line-height:1.12; letter-spacing:.01em; opacity:.88; overflow:hidden; transition:transform .2s ease, color .2s ease, border-color .2s ease, background .2s ease, box-shadow .2s ease; }.primary-nav > a:not(.button)::before { content:""; position:absolute; inset:0; border-radius:inherit; background:linear-gradient(135deg, rgba(255,255,255,.12), rgba(92,197,255,.10) 50%, rgba(255,255,255,.04)); opacity:0; transition:opacity .2s ease; z-index:-1; }.primary-nav > a:not(.button):hover { color:#fff; opacity:1; transform:translateY(-1px); border-color:rgba(255,255,255,.14); background:rgba(255,255,255,.06); box-shadow:0 8px 20px rgba(0,0,0,.16), inset 0 1px 0 rgba(255,255,255,.08); }.primary-nav > a:not(.button):hover::before { opacity:1; }.primary-nav > a:not(.button).active-tab { color:#fff; opacity:1; border-color:rgba(116,214,255,.4); background:linear-gradient(135deg, rgba(116,214,255,.24) 0%, rgba(255,255,255,.10) 100%); box-shadow:0 0 0 1px rgba(116,214,255,.15), 0 12px 28px rgba(61,172,231,.16), inset 0 1px 0 rgba(255,255,255,.1); }.primary-nav > a:not(.button).active-tab::after { content:""; position:absolute; inset:auto 18% 0; height:2px; border-radius:999px; background:linear-gradient(90deg, transparent, #7ad8ff, transparent); box-shadow:0 0 16px rgba(122,216,255,.9); }.primary-nav .button { margin-left:.25rem; box-shadow:0 14px 30px rgba(191,32,39,.26); }.technology-carousel { margin-top:1.2rem; overflow:hidden; border:1px solid var(--line); border-radius:var(--radius); background:#f0f2ea; }.carousel-track { position:relative; min-height:420px; }.technology-slide { position:absolute; inset:0; display:grid; grid-template-columns:1.15fr .85fr; align-items:stretch; opacity:0; pointer-events:none; transition:opacity .45s ease; }.technology-slide.active { position:relative; opacity:1; pointer-events:auto; }.technology-slide img { width:100%; height:420px; object-fit:cover; }.technology-slide > div { display:flex; flex-direction:column; justify-content:center; padding:clamp(1.8rem,4vw,4rem); }.technology-slide h3 { max-width:360px; margin-bottom:.8rem; font-size:clamp(1.9rem,3.1vw,3.2rem); letter-spacing:-.06em; line-height:1; }.technology-slide p:not(.card-kicker) { max-width:360px; color:var(--muted); }.carousel-controls { display:flex; align-items:center; justify-content:center; gap:.8rem; padding:.8rem; border-top:1px solid var(--line); background:#fff; }.carousel-controls button { display:grid; width:2.3rem; height:2.3rem; place-items:center; border:1px solid var(--line); border-radius:50%; color:var(--ink); background:#fff; cursor:pointer; font-size:1rem; }.carousel-controls button:hover { color:#fff; border-color:var(--red); background:var(--red); }.carousel-dots { display:flex; gap:.4rem; }.carousel-dots button { width:.48rem; min-width:0; height:.48rem; padding:0; border:0; background:#c7ccc1; }.carousel-dots button.active { width:1.5rem; border-radius:99px; background:var(--red); }.savings-period { display:flex; width:max-content; margin:1.4rem 0 -.2rem; padding:3px; border:1px solid var(--line); border-radius:99px; background:#f0f2eb; }.period-button { padding:.45rem .8rem; border:0; border-radius:99px; color:var(--muted); background:transparent; font:800 .72rem/1 inherit; cursor:pointer; }.period-button.active { color:#fff; background:var(--ink); }.savings-result { min-height:5.2rem; padding:1rem; border-radius:.7rem; color:var(--ink); background:#eff5e6; }.cost-compare { display:grid; grid-template-columns:1fr 1fr; gap:.7rem; margin-top:.7rem; }.cost-compare span { display:block; color:var(--muted); font-size:.68rem; font-weight:700; text-transform:uppercase; letter-spacing:.06em; }.cost-compare strong { display:block; margin-top:.12rem; font-size:1.05rem; }.cost-compare .with-coat strong { color:#147046; }.product-catalogue { display:grid; grid-template-columns:repeat(4,1fr); gap:1rem; }.catalogue-product { display:flex; min-height:285px; flex-direction:column; align-items:flex-start; justify-content:space-between; padding:1.1rem; border:1px solid var(--line); border-radius:1rem; color:var(--ink); background:#fff; text-align:left; cursor:pointer; transition:transform .2s ease, box-shadow .2s ease; }.catalogue-product:hover { box-shadow:0 15px 26px rgba(21,23,22,.1); transform:translateY(-4px); }.catalogue-product img { width:100%; height:155px; object-fit:contain; mix-blend-mode:multiply; }.catalogue-product span { color:var(--muted); font-size:.68rem; font-weight:800; letter-spacing:.08em; text-transform:uppercase; }.catalogue-product strong { margin-top:.35rem; font-size:1rem; line-height:1.13; }.product-dialog { width:min(760px,calc(100% - 2rem)); padding:0; overflow:hidden; border:0; border-radius:1.25rem; box-shadow:0 30px 90px rgba(0,0,0,.35); }.product-dialog::backdrop { background:rgba(7,13,12,.75); backdrop-filter:blur(4px); }.dialog-product { display:grid; grid-template-columns:.9fr 1.1fr; min-height:380px; }.dialog-product img { width:100%; height:100%; min-height:380px; padding:2rem; object-fit:contain; background:#eceee5; }.dialog-product > div { display:flex; flex-direction:column; justify-content:center; padding:clamp(1.8rem,5vw,4rem); }.dialog-product h2 { margin-bottom:1rem; font-size:clamp(2rem,4vw,3.5rem); letter-spacing:-.06em; line-height:.96; }.dialog-product p:not(.card-kicker) { color:var(--muted); }.dialog-product .button { align-self:flex-start; margin-top:1rem; }.dialog-close { position:absolute; z-index:2; top:.8rem; right:.8rem; display:grid; width:2.2rem; height:2.2rem; place-items:center; border:0; border-radius:50%; color:#fff; background:var(--ink); cursor:pointer; font-size:1.4rem; }.site-footer, .section-dark { overflow:hidden; } html[lang="ta"] body { font-family:"Noto Sans Tamil", "Latha", system-ui, sans-serif; }.dealer-actions, .contact-actions { white-space:normal; }
@media (max-width:1100px) { .primary-nav > a:not(.button) { padding:.43rem .48rem; font-size:.71rem; }.primary-nav { gap:.1rem; }.brand { font-size:.7rem; }.product-catalogue { grid-template-columns:repeat(3,1fr); }.benefit-grid { grid-template-columns:repeat(2,1fr); } }
@media (min-width:761px) and (max-width:960px) { .menu-toggle { display:grid; gap:5px; width:40px; height:40px; place-content:center; border:1px solid rgba(255,255,255,.38); border-radius:50%; background:transparent; }.menu-toggle i { display:block; width:14px; height:1px; background:#fff; }.primary-nav { position:absolute; top:72px; left:1.5rem; right:1.5rem; display:none; align-items:stretch; gap:.4rem; padding:.75rem; border-radius:1.2rem; background:linear-gradient(135deg, rgba(17,26,23,.92), rgba(15,69,115,.84)); box-shadow:0 20px 45px rgba(0,0,0,.3); }.primary-nav.open { display:flex; flex-direction:column; }.primary-nav > a:not(.button) { width:100%; min-width:0; justify-content:flex-start; padding:.84rem .85rem; font-size:.95rem; }.primary-nav .button { margin:.35rem .15rem 0; width:calc(100% - .3rem); }.product-catalogue { grid-template-columns:repeat(3,1fr); } }
@media (max-width:760px) { .site-header { background:linear-gradient(180deg,rgba(10,18,16,.72),transparent); }.primary-nav { border-radius:1.2rem; background:linear-gradient(180deg, rgba(17,26,23,.96), rgba(13,50,82,.94)); }.primary-nav > a:not(.button) { width:100%; min-width:0; justify-content:flex-start; padding:.9rem .85rem; font-size:.95rem; }.language-switch { margin-right:.1rem; }.technology-slide { grid-template-columns:1fr; }.carousel-track { min-height:540px; }.technology-slide img { height:260px; }.technology-slide > div { padding:1.7rem; }.product-catalogue { grid-template-columns:repeat(2,1fr); gap:.7rem; }.catalogue-product { min-height:240px; padding:.8rem; }.catalogue-product img { height:125px; }.dialog-product { grid-template-columns:1fr; }.dialog-product img { min-height:230px; height:230px; padding:1.2rem; }.dialog-product > div { padding:2rem 1.4rem; }.cost-compare { grid-template-columns:1fr; }.hero-caption { margin-top:2rem; } }
@media (max-width:380px) { .brand > span { display:none; }.shell { width:min(calc(100% - 1.25rem),var(--shell)); }.product-catalogue { grid-template-columns:1fr; }.button-group { flex-wrap:wrap; gap:.8rem; } }

@media (max-width:760px) {
  .story-intro,
  .story-narrative,
  .story-commitments {
    grid-template-columns:1fr;
  }
  .story-intro {
    gap:2rem;
  }
  .story h2 {
    font-size:clamp(2.75rem,13vw,4.25rem);
  }
  .story-statement {
    max-width:28rem;
  }
  .story-narrative {
    gap:1.35rem;
    margin-top:2.6rem;
  }
  .story-commitment {
    min-height:0;
  }
}

/* Infrastructure gallery */
.infrastructure {
  position:relative;
  overflow:hidden;
  color:var(--ink);
  background:radial-gradient(circle at 8% 10%, rgba(205,61,61,.18), transparent 20%), radial-gradient(circle at 94% 85%, rgba(113,191,169,.33), transparent 27%), linear-gradient(135deg,#f7f4e9 0%,#e5f1eb 52%,#e0eff1 100%);
}
.infrastructure::before {
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  opacity:.45;
  background:linear-gradient(90deg,rgba(23,58,54,.045) 1px,transparent 1px), linear-gradient(rgba(23,58,54,.045) 1px,transparent 1px);
  background-size:34px 34px;
}
.infrastructure .shell {
  position:relative;
}
.infrastructure-copy .eyebrow {
  color:var(--red);
}
.infrastructure-copy > p:not(.eyebrow) {
  color:#47605a;
}
.infrastructure-points div {
  border-color:rgba(29,73,64,.16);
  background:rgba(255,255,255,.58);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.7);
}
.infrastructure-points strong {
  color:var(--ink);
}
.infrastructure-points span {
  color:#536b65;
}
.infrastructure-carousel {
  overflow:hidden;
  border:1px solid rgba(22,58,53,.17);
  border-radius:1.25rem;
  background:#fcfdf8;
  box-shadow:0 24px 60px rgba(20,65,56,.14), inset 0 1px 0 #fff;
}
.infrastructure-slides {
  position:relative;
  aspect-ratio:4 / 3;
  background:#e8eee9;
}
.infrastructure-slide {
  position:absolute;
  inset:0;
  display:grid;
  grid-template-rows:1fr auto;
  margin:0;
  opacity:0;
  pointer-events:none;
  transition:opacity .38s ease;
}
.infrastructure-slide.active {
  opacity:1;
  pointer-events:auto;
}
.infrastructure-slide img {
  width:100%;
  height:100%;
  min-height:0;
  object-fit:cover;
  object-position:center;
}
.infrastructure-slide figcaption {
  position:absolute;
  right:1rem;
  bottom:1rem;
  left:1rem;
  display:flex;
  flex-direction:column;
  gap:.14rem;
  padding:.8rem 1rem;
  border:1px solid rgba(255,255,255,.35);
  border-radius:.8rem;
  color:#fff;
  background:linear-gradient(100deg,rgba(10,26,24,.86),rgba(10,26,24,.46));
  backdrop-filter:blur(10px);
}
.infrastructure-slide figcaption span {
  color:#d9f2b4;
  font-size:.66rem;
  font-weight:850;
  letter-spacing:.1em;
  text-transform:uppercase;
}
.infrastructure-slide figcaption strong {
  font-size:1rem;
  line-height:1.2;
}
.infrastructure-carousel-footer {
  display:grid;
  grid-template-columns:auto 1fr;
  gap:.9rem;
  align-items:center;
  padding:.75rem;
}
.infrastructure-carousel-actions {
  display:flex;
  align-items:center;
  gap:.45rem;
}
.infrastructure-carousel-actions button {
  display:grid;
  width:2.25rem;
  height:2.25rem;
  place-items:center;
  border:1px solid rgba(29,73,64,.2);
  border-radius:50%;
  color:#17433c;
  background:#fff;
  cursor:pointer;
  font:700 1rem/1 inherit;
  transition:color .2s ease, background .2s ease, transform .2s ease;
}
.infrastructure-carousel-actions button:hover {
  color:#fff;
  background:var(--red);
  border-color:var(--red);
  transform:translateY(-1px);
}
.infrastructure-carousel-actions span {
  min-width:3.6rem;
  color:#68817a;
  font-size:.73rem;
  font-weight:750;
  text-align:center;
}
.infrastructure-carousel-actions b {
  color:var(--ink);
}
.infrastructure-thumbnails {
  display:grid;
  grid-template-columns:repeat(6,1fr);
  gap:.38rem;
}
.infrastructure-thumbnails button {
  height:2.55rem;
  padding:0;
  overflow:hidden;
  border:1px solid transparent;
  border-radius:.45rem;
  opacity:.6;
  background:#dde7e1;
  cursor:pointer;
  transition:border-color .2s ease, opacity .2s ease, transform .2s ease;
}
.infrastructure-thumbnails button:hover,
.infrastructure-thumbnails button.active {
  opacity:1;
  border-color:var(--red);
  transform:translateY(-1px);
}
.infrastructure-thumbnails img {
  width:100%;
  height:100%;
  object-fit:cover;
}
@media (max-width:760px) {
  .hero {
    background-position:43% center;
  }
  .hero::after {
    background:linear-gradient(90deg, rgba(3,35,52,.56), rgba(3,35,52,.18)), linear-gradient(0deg, rgba(3,35,52,.32), transparent 44%);
  }
  .infrastructure {
    background:linear-gradient(145deg,#f7f4e9 0%,#e2f0eb 100%);
  }
  .infrastructure-carousel-footer {
    grid-template-columns:1fr;
  }
  .infrastructure-carousel-actions {
    justify-content:center;
  }
  .infrastructure-thumbnails {
    gap:.3rem;
  }
  .infrastructure-thumbnails button {
    height:2.15rem;
  }
  .infrastructure-slide figcaption {
    right:.7rem;
    bottom:.7rem;
    left:.7rem;
    padding:.65rem .75rem;
  }
  .infrastructure-slide figcaption strong {
    font-size:.9rem;
  }
}

/* Footer colour treatment aligned with the landing hero */
.site-footer {
  position:relative;
  isolation:isolate;
  overflow:hidden;
  color:rgba(244,251,255,.8);
  background:radial-gradient(circle at 88% 12%, rgba(89,196,239,.32), transparent 26%), radial-gradient(circle at 11% 110%, rgba(27,134,169,.36), transparent 38%), linear-gradient(125deg,#042c47 0%,#075c83 52%,#063a5b 100%);
}
.site-footer::before {
  content:"";
  position:absolute;
  z-index:-1;
  inset:0;
  opacity:.48;
  background:linear-gradient(90deg,rgba(255,255,255,.055) 1px,transparent 1px), linear-gradient(rgba(255,255,255,.04) 1px,transparent 1px);
  background-size:38px 38px;
  mask-image:linear-gradient(135deg,#000,transparent 76%);
}
.site-footer::after {
  content:"";
  position:absolute;
  z-index:-1;
  right:-7rem;
  bottom:-9rem;
  width:24rem;
  aspect-ratio:1;
  border:1px solid rgba(214,228,71,.24);
  border-radius:50%;
  box-shadow:0 0 0 2.8rem rgba(214,228,71,.035), 0 0 0 5.6rem rgba(214,228,71,.02);
}
.site-footer .footer-label,
.site-footer .footer-grid a:hover,
.site-footer .footer-bottom a:hover {
  color:#fff;
}
.site-footer .footer-label {
  color:#d9f3ff;
}
.site-footer .footer-bottom {
  border-top-color:rgba(220,244,255,.22);
}
.site-footer .footer-credit {
  opacity:.76;
}

@media (min-width:961px) {
  .nav-wrap {
    gap:1.25rem;
  }
  .language-switch {
    padding:2px;
    gap:2px;
    background:rgba(8,16,18,.14);
    border-color:rgba(255,255,255,.1);
    box-shadow:0 8px 22px rgba(0,0,0,.08);
  }
  .language-button {
    min-width:32px;
    padding:.28rem .48rem;
    font-size:.64rem;
  }
}

/* Persistent landing shell and tab-specific views */
.tab-page { display:none; }.tab-page.is-active { display:block; }.hero-welcome { display:inline-flex; align-items:center; margin:0 0 .9rem; padding:.36rem .84rem .34rem .78rem; border:1px solid rgba(214,228,71,.22); border-left:3px solid rgba(214,228,71,.95); border-radius:999px; color:#fff; background:linear-gradient(135deg, rgba(8,16,18,.38), rgba(255,255,255,.04)); font-family:"Avenir Next Condensed","Arial Narrow","Helvetica Neue",Arial,sans-serif; font-size:clamp(.88rem,1.05vw,1.08rem); font-weight:900; letter-spacing:.18em; text-transform:uppercase; line-height:1; box-shadow:0 10px 22px rgba(0,0,0,.12), inset 0 1px 0 rgba(255,255,255,.04); backdrop-filter:blur(10px); }.landing-highlights { padding:clamp(3rem,7vw,5.5rem) 0; }.landing-highlights-grid { display:grid; grid-template-columns:.9fr 1.1fr; gap:clamp(2rem,6vw,4rem); align-items:start; margin-bottom:1.2rem; }.landing-intro { padding:clamp(1.5rem,3vw,2.2rem); border:1px solid var(--line); border-radius:var(--radius); background:#fff; }.landing-intro h2 { margin-bottom:.9rem; font-size:clamp(1.8rem,3.8vw,3.5rem); letter-spacing:-.06em; line-height:1; }.landing-intro p:last-child { max-width:620px; margin-bottom:0; color:var(--muted); }.landing-stats { display:grid; grid-template-columns:repeat(2,1fr); gap:1rem; }.landing-stats article, .landing-feature { padding:1.35rem; border:1px solid var(--line); border-radius:1rem; background:#fff; }.landing-stats article { min-height:120px; display:flex; flex-direction:column; justify-content:space-between; }.landing-stats strong { font-size:clamp(2rem,3vw,3rem); line-height:1; letter-spacing:-.06em; }.landing-stats span { color:var(--muted); font-size:.82rem; }.landing-feature-grid { display:grid; grid-template-columns:1fr 1fr; gap:1rem; }.landing-feature { min-height:220px; background:linear-gradient(180deg,#fff 0%,#f5f7ef 100%); }.landing-feature h3 { max-width:320px; margin-bottom:.7rem; font-size:clamp(1.25rem,2.1vw,2rem); letter-spacing:-.04em; line-height:1.05; }.landing-feature p:not(.card-kicker) { max-width:450px; color:var(--muted); }.mini-swatch-row { display:flex; flex-wrap:wrap; gap:.55rem; margin-top:1rem; }.mini-swatch-row span { padding:.45rem .7rem; border:1px solid var(--line); border-radius:99px; color:var(--muted); font-size:.74rem; font-weight:700; }.technology-feature { position:relative; display:grid; grid-template-columns:1fr 1fr; gap:1.2rem; align-items:center; margin:0 0 1.2rem; padding:1.2rem; border:1px solid var(--line); border-radius:calc(var(--radius) + .2rem); background:linear-gradient(135deg,#fff 0%,#eef4f6 100%); box-shadow:0 18px 40px rgba(18,26,25,.08); overflow:hidden; }.technology-feature::before { content:""; position:absolute; inset:0 auto 0 0; width:34%; background:radial-gradient(circle at left center, rgba(122,216,255,.2), transparent 72%); pointer-events:none; }.technology-feature img { width:100%; min-height:320px; max-height:420px; object-fit:cover; border-radius:1rem; box-shadow:0 24px 50px rgba(13,18,17,.18); }.technology-feature h3 { margin-bottom:.7rem; font-size:clamp(1.8rem,3vw,3.1rem); letter-spacing:-.06em; line-height:.98; }.technology-feature p:not(.card-kicker) { max-width:520px; color:var(--muted); }.feature-actions { display:flex; align-items:center; flex-wrap:wrap; gap:1rem; margin-top:1.1rem; }.feature-actions .button { box-shadow:0 16px 30px rgba(191,32,39,.24); }.feature-actions .text-link { color:var(--red); }.catalogue-product-featured { min-height:360px; padding:1.35rem; color:#fff; background:linear-gradient(145deg,#bf2027 0%,#7b1016 100%); box-shadow:0 22px 40px rgba(191,32,39,.22); }.catalogue-product-featured img { height:205px; object-fit:contain; mix-blend-mode:normal; filter:drop-shadow(0 22px 18px rgba(0,0,0,.18)); transform:scale(1.08); transform-origin:center bottom; }.catalogue-product-featured strong { font-size:1.1rem; }.catalogue-product-featured span { color:rgba(255,255,255,.75); }.catalogue-product-featured:hover { box-shadow:0 26px 48px rgba(191,32,39,.3); }.catalogue-product-featured:hover img { transform:scale(1.1) translateY(-4px); }.inspection-form { width:min(100%,600px); padding:1.25rem; border:1px solid rgba(21,23,22,.16); border-radius:1rem; background:rgba(255,255,255,.78); }.form-grid { display:grid; grid-template-columns:1fr 1fr; gap:.8rem; margin-bottom:1rem; }.inspection-form label { display:grid; gap:.35rem; color:#364032; font-size:.72rem; font-weight:800; }.inspection-form input, .inspection-form textarea, .inspection-form select { width:100%; padding:.72rem .8rem; border:1px solid #cfd4c9; border-radius:.55rem; color:var(--ink); background:#fff; font:inherit; }.inspection-form textarea { resize:vertical; }.inspection-form input:focus, .inspection-form textarea:focus, .inspection-form select:focus { outline:3px solid rgba(191,32,39,.16); border-color:var(--red); }.form-full { grid-column:1/-1; }.form-status { min-height:1.2rem; margin:.75rem 0 0; color:#147046; font-size:.78rem; font-weight:700; }.contact-panel { align-items:flex-start; }.contact-panel > div { max-width:520px; }
.inspection-form .consent-field { display:flex; align-items:flex-start; gap:.65rem; font-weight:650; line-height:1.45; cursor:pointer; }.inspection-form .consent-field input { flex:0 0 auto; width:1rem; height:1rem; margin:.12rem 0 0; padding:0; accent-color:var(--red); }
.inspection-form .button:disabled { cursor:wait; opacity:.65; transform:none; }.form-status.is-error { color:var(--red-dark); }
.inspection-form .form-hint { color:#5f6858; font-size:.68rem; font-weight:500; line-height:1.45; }

/* Contact hub keeps branch details scannable while separating them from the enquiry form. */
.contact-heading { max-width:680px; margin-bottom:2.2rem; }.contact-heading h2 { max-width:670px; margin-bottom:.9rem; font-size:clamp(2.55rem,5.2vw,5rem); letter-spacing:-.07em; line-height:.94; }.contact-heading > p:last-child { max-width:560px; color:var(--muted); }.contact-channel-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:1rem; }.contact-channel { display:flex; min-height:166px; flex-direction:column; justify-content:space-between; padding:1.35rem; border:1px solid var(--line); border-radius:1rem; background:linear-gradient(145deg,#fff,#f5f7ef); transition:transform .2s ease,box-shadow .2s ease,border-color .2s ease; }.contact-channel:hover { border-color:rgba(191,32,39,.34); box-shadow:0 18px 34px rgba(21,23,22,.09); transform:translateY(-4px); }.contact-channel span,.branch-card .card-kicker { color:var(--red); font-size:.7rem; font-weight:850; letter-spacing:.1em; text-transform:uppercase; }.contact-channel strong { margin:1.1rem 0 .7rem; color:var(--ink); font-size:clamp(1rem,1.5vw,1.25rem); letter-spacing:-.035em; overflow-wrap:anywhere; }.contact-channel small { color:var(--muted); font-size:.76rem; }.contact-working-hours { margin:1rem 0 clamp(3.5rem,7vw,6rem); color:var(--muted); font-size:.84rem; font-weight:700; }.contact-working-hours::before { content:""; display:inline-block; width:.5rem; height:.5rem; margin:0 .55rem .06rem 0; border-radius:50%; background:var(--red); }.branch-heading { max-width:680px; margin-bottom:1.35rem; }.branch-heading h3 { margin-bottom:0; font-size:clamp(1.8rem,3vw,3.1rem); letter-spacing:-.06em; line-height:1; }.branch-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:1rem; }.branch-card { display:flex; min-height:244px; flex-direction:column; padding:1.3rem; border:1px solid var(--line); border-radius:1rem; background:#fff; }.branch-card-head { color:#fff; border-color:#8f181e; background:linear-gradient(145deg,#bf2027,#791216); }.branch-card-head .card-kicker,.branch-card-head address { color:rgba(255,255,255,.75); }.branch-card h4 { margin:1rem 0 .8rem; font-size:1.12rem; letter-spacing:-.035em; }.branch-card address { margin:0; color:var(--muted); font-size:.84rem; font-style:normal; line-height:1.5; }.branch-card a { margin-top:auto; padding-top:1.2rem; color:var(--red); font-size:.84rem; font-weight:800; }.branch-card-head a { color:#fff; }.inspection-panel { display:grid; grid-template-columns:minmax(0,.75fr) minmax(0,1fr); gap:clamp(2rem,6vw,5rem); align-items:start; margin-top:clamp(4rem,8vw,7rem); padding:clamp(1.5rem,4vw,3rem); border-radius:var(--radius); background:var(--lime); }.inspection-panel h3 { max-width:440px; margin-bottom:.9rem; font-size:clamp(2rem,3.8vw,3.7rem); letter-spacing:-.065em; line-height:.96; }.inspection-panel > div > p:not(.eyebrow) { max-width:420px; color:#38402f; }.inspection-panel .inspection-form { width:100%; background:rgba(255,255,255,.88); }.inspection-panel .eyebrow { color:#4d5e21; }
@media (max-width:960px) { .contact-channel-grid { grid-template-columns:repeat(2,1fr); }.branch-grid { grid-template-columns:repeat(2,1fr); }.inspection-panel { grid-template-columns:1fr; } }
@media (max-width:620px) { .contact-channel-grid,.branch-grid { grid-template-columns:1fr; }.contact-channel { min-height:unset; }.branch-card { min-height:210px; }.inspection-panel { margin-top:3.5rem; padding:1.15rem; } }

/* Compact contact directory: make the useful details the visual focus. */
.contact-channel-grid { margin-bottom:0; }.contact-channel { display:grid; min-height:0; grid-template-columns:max-content minmax(0,1fr); align-items:center; gap:.35rem .8rem; padding:1rem 1.15rem; }.contact-channel strong { margin:0; font-size:clamp(.98rem,1.35vw,1.16rem); }.contact-channel small { grid-column:2; }.contact-working-hours { margin:1rem 0 2.8rem; }.branch-heading { margin-bottom:1rem; }.branch-grid { gap:.85rem; }.branch-card { min-height:0; padding:1.15rem; }.branch-card h4 { margin:.72rem 0 .55rem; }.branch-card a { margin-top:.95rem; padding-top:0; }.branch-card-head { color:var(--ink); border-color:var(--line); background:#fff; }.branch-card-head .card-kicker { color:var(--red); }.branch-card-head address { color:var(--muted); }.branch-card-head a { color:var(--red); }
@media (max-width:960px) { .contact-channel-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }.contact-channel:last-child { grid-column:1/-1; } }
@media (max-width:620px) { .contact-channel-grid { grid-template-columns:1fr; }.contact-channel:last-child { grid-column:auto; }.contact-working-hours { margin-bottom:2.2rem; } }

/* Overrides for logo, product selection and landing emphasis */
.brand img { width:auto; height:42px; }
.brand-footer img { height:38px; }
.landing-feature-grid { grid-template-columns:repeat(3, minmax(0, 1fr)); }
.landing-feature-highlight { color:#fff; background:linear-gradient(145deg,#bf2027 0%,#7b1016 100%); box-shadow:0 22px 40px rgba(191,32,39,.2); }
.landing-feature-highlight p:not(.card-kicker) { color:rgba(255,255,255,.82); }
.landing-feature-highlight .mini-swatch-row span { color:rgba(255,255,255,.82); border-color:rgba(255,255,255,.18); }
.catalogue-product.is-active { border-color:rgba(191,32,39,.42); box-shadow:0 18px 34px rgba(191,32,39,.16); transform:translateY(-4px); }
.catalogue-product.is-active img { transform:translateY(-4px) scale(1.02); }
.footer-brand .brand { gap:.4rem; }
.footer-legal { display:grid; gap:.34rem; }.footer-credit { opacity:.68; font-size:.7rem; }
@media (max-width:760px) { .landing-highlights-grid, .landing-feature-grid, .technology-feature { grid-template-columns:1fr; }.landing-stats { grid-template-columns:1fr; }.landing-intro { padding:1.3rem; }.landing-feature { min-height:unset; }.technology-feature { padding:1rem; }.technology-feature img { min-height:220px; height:260px; }.feature-actions { gap:.8rem; }.feature-actions .button, .feature-actions .text-link { width:100%; justify-content:center; }.catalogue-product-featured { min-height:300px; }.catalogue-product-featured img { height:160px; }.form-grid { grid-template-columns:1fr; }.form-full { grid-column:auto; }.inspection-form { padding:1rem; } }

/* Hero logo and copy contrast for the bright cool-roof visual */
.site-header .brand {
  padding:0;
  border:0;
  border-radius:0;
  background:transparent;
  box-shadow:none;
  backdrop-filter:none;
}
.site-header .brand img {
  height:48px;
  background:transparent;
  filter:brightness(1.26) saturate(1.22) contrast(1.08) drop-shadow(0 0 7px rgba(255,89,83,.36));
}
.hero-copy {
  padding:0;
  border:0;
  border-radius:0;
  background:transparent;
  box-shadow:none;
  backdrop-filter:none;
}
.hero-welcome {
  display:block;
  padding:0;
  color:#f0ff82;
  border:0;
  border-radius:0;
  background:transparent;
  box-shadow:none;
  backdrop-filter:none;
}
.hero h1 {
  color:#e9faff;
  text-shadow:0 3px 18px rgba(1,26,39,.34);
}
.hero .eyebrow {
  color:#f0ff82;
}
.hero-intro {
  color:#e5f7ff;
}
.hero .text-link {
  color:#f0ff82;
}
.hero-caption {
  color:#d8f4ff;
}
.brand-footer {
  padding:0 !important;
  border:0 !important;
  background:transparent !important;
  box-shadow:none !important;
  backdrop-filter:none !important;
}
.brand-footer img {
  height:42px;
  filter:brightness(1.24) saturate(1.2) contrast(1.08) drop-shadow(0 0 7px rgba(255,89,83,.28));
}

/* Landing proof points, product focus and enquiry-led Cool Roof experience. */
.landing-proof-grid {
  display:grid;
  gap:.7rem;
}
.landing-proof-grid article {
  display:grid;
  grid-template-columns:2.5rem minmax(0,1fr);
  column-gap:.85rem;
  align-items:start;
  padding:1rem 1.1rem;
  border:1px solid var(--line);
  border-radius:1rem;
  background:linear-gradient(135deg,#fff 0%,#f2f7f4 100%);
}
.proof-mark {
  display:grid;
  width:2.2rem;
  height:2.2rem;
  place-items:center;
  border-radius:50%;
  color:#0f5e83;
  background:#d9f2ff;
  font-size:.67rem;
  font-weight:900;
  letter-spacing:.06em;
}
.landing-proof-grid h3 {
  margin:.18rem 0 .3rem;
  font-size:1rem;
  letter-spacing:-.035em;
  line-height:1.05;
}
.landing-proof-grid p {
  grid-column:2;
  margin:0;
  color:var(--muted);
  font-size:.8rem;
  line-height:1.45;
}
.landing-feature-cool {
  position:relative;
  overflow:hidden;
  border-color:#b8d9e7;
  background:linear-gradient(145deg,#f8fdff 0%,#dceff7 100%);
  box-shadow:0 18px 36px rgba(30,113,151,.13);
}
.landing-feature-cool::after {
  content:"";
  position:absolute;
  right:-16%;
  bottom:-42%;
  width:72%;
  aspect-ratio:1;
  border:1px solid rgba(36,129,171,.2);
  border-radius:50%;
}
.landing-feature-cool > img {
  position:absolute;
  z-index:1;
  right:-3%;
  bottom:8%;
  width:42%;
  max-height:72%;
  object-fit:contain;
  filter:drop-shadow(0 18px 14px rgba(10,42,57,.17));
}
.landing-feature-cool-copy {
  position:relative;
  z-index:2;
  width:67%;
}
.landing-feature-cool .card-kicker,
.landing-feature-cool .text-link {
  color:#0f5e83;
}
.landing-feature-cool .mini-swatch-row span {
  border-color:rgba(15,94,131,.18);
  color:#245367;
  background:rgba(255,255,255,.5);
}
.landing-feature-cool .text-link {
  margin-top:1rem;
}
.savings-inline {
  margin-top:clamp(2.4rem,5vw,4.5rem);
  padding:clamp(1.5rem,4vw,3.5rem);
  border-radius:calc(var(--radius) + .2rem);
  background:linear-gradient(125deg,#102d3d 0%,#075a7d 58%,#13372c 100%);
  box-shadow:0 24px 50px rgba(9,44,57,.18);
}
.savings-inline .savings-grid {
  gap:clamp(2rem,7vw,6rem);
}
.catalogue-product.is-active {
  border-color:var(--line);
  box-shadow:none;
  transform:none;
}
.catalogue-product.is-active img {
  transform:none;
}
.site-header .brand img {
  height:64px;
}
.brand-footer img {
  height:44px;
}
@media (min-width:761px) and (max-width:960px) {
  .site-header .brand img { height:52px; }
  .nav-wrap { min-height:82px; }
  .primary-nav { top:82px; }
}
@media (max-width:760px) {
  .site-header .brand img { height:46px; }
  .nav-wrap { min-height:76px; }
  .primary-nav { top:76px; }
  .landing-proof-grid article { grid-template-columns:2.2rem minmax(0,1fr); }
  .landing-feature-cool > img { right:0; width:34%; }
  .landing-feature-cool-copy { width:72%; }
  .savings-inline { margin-top:2.2rem; padding:1.2rem; }
}

/* Portfolio-style catalogue: varied product stories instead of repeated tiles. */
.product-catalogue {
  grid-template-columns:repeat(12, minmax(0, 1fr));
  grid-auto-flow:dense;
  gap:1.1rem;
}
.catalogue-product {
  position:relative;
  grid-column:span 3;
  min-height:340px;
  overflow:hidden;
  justify-content:flex-end;
  padding:1.2rem;
  isolation:isolate;
  border-color:#d6ded9;
  background:linear-gradient(155deg,#ffffff 0%,#eef3ef 100%);
}
.catalogue-product::after {
  content:"";
  position:absolute;
  z-index:-1;
  inset:auto -28% -34% auto;
  width:70%;
  aspect-ratio:1;
  border:1px solid rgba(28,98,75,.15);
  border-radius:50%;
}
.catalogue-product img {
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  padding:1rem;
  object-fit:cover;
  mix-blend-mode:normal;
  opacity:.9;
  transition:transform .45s ease, opacity .45s ease;
}
.catalogue-product::before {
  content:"";
  position:absolute;
  inset:0;
  z-index:0;
  background:linear-gradient(180deg,rgba(10,20,18,.02) 16%,rgba(7,22,19,.78) 100%);
}
.catalogue-product span,
.catalogue-product strong {
  position:relative;
  z-index:1;
  color:#fff;
}
.catalogue-product span {
  margin-top:auto;
  font-size:.67rem;
  opacity:.8;
}
.catalogue-product strong {
  margin-top:.42rem;
  font-size:clamp(1.08rem,1.5vw,1.38rem);
  letter-spacing:-.045em;
}
.catalogue-product:hover {
  border-color:rgba(12,95,74,.45);
  box-shadow:0 22px 38px rgba(13,33,25,.16);
}
.catalogue-product:hover img {
  transform:scale(1.045);
  opacity:1;
}
.portfolio-card--hero {
  grid-column:span 6;
  min-height:430px;
  background:#e6f4f8;
}
.portfolio-card--hero img {
  width:64%;
  margin-left:auto;
  padding:1.6rem;
  object-fit:contain;
}
.portfolio-card--hero::before {
  background:linear-gradient(90deg,rgba(7,44,64,.94) 0%,rgba(7,44,64,.57) 47%,rgba(7,44,64,.02) 82%);
}
.portfolio-card--hero::after {
  border-color:rgba(85,200,236,.36);
}
.portfolio-card--tall {
  grid-column:span 3;
  grid-row:span 2;
  min-height:580px;
}
.portfolio-card--tall img {
  padding:0;
  object-position:center;
}
.portfolio-card--wide {
  grid-column:span 6;
  min-height:270px;
}
.portfolio-card--wide img {
  object-position:center;
}
.dialog-product {
  max-height:min(82vh,860px);
  overflow:auto;
}
.dialog-product > div {
  justify-content:flex-start;
}
.dialog-product-details {
  margin-top:1.2rem;
  padding-top:1.15rem;
  border-top:1px solid var(--line);
}
.dialog-product-details h3 {
  margin:1.1rem 0 .45rem;
  color:var(--ink);
  font-size:.9rem;
  letter-spacing:-.02em;
}
.dialog-product-details h3:first-child { margin-top:0; }
.dialog-product-details p,
.dialog-product-details ul {
  margin:.45rem 0;
  color:var(--muted);
  font-size:.82rem;
  line-height:1.55;
}
.dialog-product-details ul {
  display:grid;
  gap:.38rem;
  padding-left:1.1rem;
}
.dialog-product-details li::marker { color:#147046; }
.dialog-product-details .product-pack {
  padding:.7rem .8rem;
  border-radius:.6rem;
  color:#164c37;
  background:#e8f2e5;
  font-weight:750;
}
@media (max-width:1100px) {
  .catalogue-product { grid-column:span 4; }
  .portfolio-card--hero,
  .portfolio-card--wide { grid-column:span 8; }
  .portfolio-card--tall { grid-column:span 4; }
}
@media (max-width:760px) {
  .product-catalogue { grid-template-columns:1fr; }
  .catalogue-product,
  .portfolio-card--hero,
  .portfolio-card--wide,
  .portfolio-card--tall { grid-column:auto; grid-row:auto; min-height:300px; }
  .portfolio-card--hero { min-height:350px; }
  .portfolio-card--hero img { width:66%; }
  .dialog-product { max-height:86vh; }
}
@media (max-width:760px) {
  .site-header .brand {
    padding:0;
    border-radius:0;
  }
  .site-header .brand img {
    height:39px;
  }
  .hero-copy {
    padding:0;
    background:transparent;
  }
}

/* Final image-fit overrides */
.technology-slide img {
  object-fit: contain;
  object-position: center;
  padding: 1rem;
  background: linear-gradient(135deg, #eef4ef 0%, #ffffff 100%);
}
.technology-feature img {
  object-fit: contain;
  object-position: center;
  background: #fff;
}
.story-image img,
.gallery-main {
  object-fit: cover;
  object-position: center;
}
@media (max-width:760px) {
  .technology-slide img {
    padding: .75rem;
  }
}

/* Carousel spacing polish */
.technology-carousel {
  box-shadow: 0 22px 50px rgba(18, 26, 25, .08);
}
.technology-slide > div {
  max-width: 520px;
}
.technology-slide img {
  min-height: 100%;
}
.carousel-controls {
  padding: 1rem 1.1rem 1.1rem;
}
.carousel-dots button.active {
  width: 1.65rem;
}
@media (max-width:760px) {
  .technology-slide > div {
    padding: 1.35rem 1.1rem 1.4rem;
  }
  .carousel-controls {
    padding: .85rem .9rem 1rem;
  }
}

/* Tamil uses natural letter spacing and a script-aware fallback stack. */
html[lang="ta"] body {
  font-family:"Noto Sans Tamil", "Nirmala UI", "Latha", system-ui, sans-serif;
}
html[lang="ta"] .hero-welcome {
  padding:0;
  font-family:"Noto Sans Tamil", "Nirmala UI", "Latha", system-ui, sans-serif;
  font-size:clamp(.9rem,1.25vw,1.16rem);
  letter-spacing:0;
  text-transform:none;
  line-height:1.35;
}
html[lang="ta"] .eyebrow,
html[lang="ta"] .card-kicker,
html[lang="ta"] .catalogue-product span,
html[lang="ta"] .footer-label {
  letter-spacing:.015em;
}
html[lang="ta"] .hero h1,
html[lang="ta"] h2,
html[lang="ta"] h3 {
  letter-spacing:-.025em;
  line-height:1.15;
}

/* Uniform product tiles keep the product name readable over every supplied image. */
.product-catalogue {
  grid-template-columns:repeat(auto-fit,minmax(min(100%,320px),1fr));
  grid-auto-flow:row;
  gap:1.15rem;
}
.catalogue-product,
.portfolio-card--hero,
.portfolio-card--wide,
.portfolio-card--tall {
  display:grid;
  grid-column:auto;
  grid-row:auto;
  grid-template-rows:minmax(190px,1fr) auto;
  min-height:315px;
  padding:1.05rem;
  overflow:hidden;
  isolation:isolate;
  perspective:900px;
  border-color:#d7e0db;
  border-radius:1.1rem;
  color:var(--ink);
  background:linear-gradient(155deg,#ffffff 0%,#edf4ef 100%);
  box-shadow:0 10px 22px rgba(16,49,38,.06);
}
.catalogue-product::before,
.catalogue-product::after {
  display:none;
}
.catalogue-product .product-turntable {
  position:relative;
  grid-row:1;
  grid-column:1;
  align-self:center;
  justify-self:center;
  width:190px;
  height:190px;
  margin:0;
  display:grid;
  place-items:center;
  transform-style:preserve-3d;
  animation:product-turntable 4.2s linear infinite;
}
.catalogue-product .product-turntable img {
  position:relative;
  width:100%;
  height:100%;
  display:block;
  margin:0;
  padding:0;
  object-fit:contain;
  object-position:center;
  opacity:1;
  mix-blend-mode:normal;
  backface-visibility:visible;
  -webkit-backface-visibility:visible;
  filter:drop-shadow(0 13px 13px rgba(9,39,30,.16));
}
.catalogue-product strong {
  grid-row:2;
  grid-column:1;
  min-height:2.6em;
  margin:.32rem 0 0;
  color:#10231c;
  font-size:clamp(1.04rem,1.4vw,1.22rem);
  letter-spacing:-.04em;
  line-height:1.12;
}
.catalogue-product:hover,
.catalogue-product:focus-visible {
  border-color:rgba(18,109,78,.44);
  box-shadow:0 18px 34px rgba(14,68,50,.14);
  transform:translateY(-4px);
}
.catalogue-product:hover .product-turntable,
.catalogue-product:focus-visible .product-turntable {
  animation:none;
  transform:rotateY(0deg);
}
@keyframes product-turntable {
  from { transform:rotateY(0deg); }
  to { transform:rotateY(360deg); }
}
@media (max-width:1100px) {
  .product-catalogue { grid-template-columns:repeat(auto-fit,minmax(min(100%,300px),1fr)); }
  .catalogue-product,
  .portfolio-card--hero,
  .portfolio-card--wide,
  .portfolio-card--tall { grid-column:auto; }
}
@media (max-width:760px) {
  .product-catalogue { grid-template-columns:repeat(2,minmax(0,1fr)); gap:.8rem; }
  .catalogue-product,
  .portfolio-card--hero,
  .portfolio-card--wide,
  .portfolio-card--tall {
    grid-column:auto;
    min-height:275px;
    padding:.8rem;
  }
  .catalogue-product .product-turntable {
    width:145px;
    height:145px;
  }
  .catalogue-product strong { min-height:2.35em; font-size:.98rem; }
}
@media (max-width:380px) {
  .product-catalogue { grid-template-columns:1fr; }
}
@media (prefers-reduced-motion:reduce) {
  .catalogue-product .product-turntable { animation:none; }
}

.branch-card .branch-map {
  margin-top:.45rem;
  padding-top:0;
  color:#17719a;
  font-size:.76rem;
  font-weight:750;
}
.branch-card .branch-map::after {
  content:" ↗";
}
.branch-card .branch-map:hover {
  color:#0d4f70;
}