/*
  Rocky Mountain Waterscape Home prototype 0.3
  Visual goal: "the old RMW site, rebuilt underneath."
*/

:root{
    --slate:#46515d;
    --slate-dark:#3f4a56;
    --top:#46515d;
    --blue:#103d86;
    --cyan:#70c1ea;
    --white:#f7f7f7;
    --muted:#d9dde1;
    --max:1120px;
}

*{box-sizing:border-box}
html{background:#111}
body{
    margin:0;
    background:
        radial-gradient(ellipse at 50% -10%, #67727e 0%, #4b5662 32%, #313941 68%, #171b1f 100%);
    background-attachment:fixed;
    color:#fff;
    font-family:Arial,Helvetica,sans-serif;
    line-height:1.38;
}
a{color:inherit}
.site{
    width:min(var(--max),100%);
    margin:0 auto;
    background:
        linear-gradient(180deg, #505b67 0%, #46515d 42%, #424d58 100%);
    box-shadow:
        0 0 28px rgba(0,0,0,.72),
        inset 0 1px rgba(255,255,255,.08);
}

/* HEADER */
.top{
    background:
        linear-gradient(180deg, #56616d 0%, #48535f 54%, #424d58 100%);
    box-shadow:inset 0 1px rgba(255,255,255,.10);
    padding:24px 22px 18px;
}
.main-nav{
    display:flex;
    justify-content:center;
    gap:31px;
    flex-wrap:wrap;
    font-size:17px;
}
.main-nav a{
    color:#cfd3d7;
    text-decoration:none;
}
.main-nav a.active,
.main-nav a:hover{
    color:#fff;
    font-weight:700;
}
.nav-rule{
    position:relative;
    height:26px;
}
.nav-rule:before,
.nav-rule:after{
    content:"";
    position:absolute;
    top:14px;
    width:9px;
    height:9px;
    border-radius:50%;
    background:#f2f2f2;
}
.nav-rule:before{left:0}
.nav-rule:after{right:0}
.nav-rule span{
    position:absolute;
    left:4px;
    right:4px;
    top:17px;
    height:2px;
    background:#f2f2f2;
}
.brand-row{
    display:grid;
    grid-template-columns:minmax(360px,1fr) minmax(390px,1fr);
    align-items:center;
    gap:28px;
    padding:6px 8px 0;
}
.brand-logo img{
    display:block;
    width:min(100%,500px);
    height:auto;
    filter:drop-shadow(0 2px 2px rgba(0,0,0,.28));
}
.brand-copy{
    text-align:center;
}
.award{
    font-family:"Snell Roundhand","Apple Chancery","URW Chancery L",cursive;
    font-size:34px;
    line-height:1.12;
    color:white;
    text-shadow:0 2px 2px rgba(0,0,0,.4);
}
.big-phone{
    display:inline-block;
    margin-top:9px;
    font-size:40px;
    line-height:1;
    color:#fff;
    text-decoration:underline;
    text-underline-offset:4px;
}
.since{
    margin:10px auto 0;
    font-family:Georgia,"Times New Roman",serif;
    font-size:22px;
    line-height:1.15;
    max-width:520px;
}

/* HERO */
.hero{
    position:relative;
    line-height:0;
    background:#222;
    overflow:hidden;
}
.hero-img{
    width:100%;
    height:auto;
    display:block;
}
.hero-menu{
    position:absolute;
    left:35px;
    top:43%;
    display:flex;
    flex-direction:column;
    gap:24px;
    line-height:1;
}
.hero-menu a{
    color:#fff;
    font-size:16px;
    font-weight:700;
    text-decoration:underline;
    text-shadow:0 2px 4px #000;
}
.hero-transition{
    position:absolute;
    left:0;
    right:0;
    bottom:0;
    height:126px;
    display:grid;
    place-items:center;
    background:linear-gradient(to bottom,rgba(61,71,82,.55),rgba(61,71,82,.95));
    backdrop-filter:blur(1px);
}
.hero-transition img{
    width:min(68%,730px);
    height:auto;
    max-height:92px;
    object-fit:contain;
}

/* BODY */
.slate{
    background:
        linear-gradient(180deg, #4b5662 0%, #46515d 45%, #424c57 100%);
    box-shadow:inset 0 1px rgba(255,255,255,.035);
    padding:26px 20px 0;
    color:#fff;
    font-size:17px;
}
.intro-grid{
    display:grid;
    grid-template-columns:380px 1fr;
    min-height:315px;
}
.intro-copy p,
.middle-copy p{
    margin:0;
}
.canvas-art{
    margin-top:22px;
}
.canvas-art img{
    display:block;
    width:min(100%,370px);
    height:auto;
}
.middle-grid{
    display:grid;
    grid-template-columns:390px 1fr 215px;
    gap:22px;
    align-items:end;
    margin-top:4px;
}
.movie-link,
.cant-see{
    text-align:center;
    padding-bottom:9px;
    font-size:14px;
}
.cant-see a{
    text-decoration:underline;
}
.sustainability{
    margin-top:17px;
    padding-top:0;
}
.sustainability h1{
    margin:0 0 8px;
    font-family:Georgia,"Times New Roman",serif;
    font-size:27px;
    font-weight:400;
}
.sustainability p{
    margin:0;
    font-size:16px;
}
.recent-strip{
    margin:24px -20px 0;
    padding:16px 20px;
    background:#384753;
    border-top:1px solid rgba(255,255,255,.18);
    display:flex;
    justify-content:space-between;
    align-items:center;
    gap:20px;
}
.recent-strip h2{
    font-family:Georgia,"Times New Roman",serif;
    font-weight:400;
    font-size:26px;
    margin:0 0 3px;
}
.recent-strip p{margin:0;color:#e1e6ea}
.recent-strip>a{
    flex:none;
    padding:9px 14px;
    border:1px solid #99d9ff;
    background:#147fbc;
    border-radius:4px;
    color:#fff;
    text-decoration:none;
    font-weight:700;
}

/* FOOTER */
.footer{
    background:var(--blue);
    padding:18px 20px 22px;
}
.footer-title{
    font-size:23px;
    margin-bottom:18px;
}
.footer-grid{
    display:grid;
    grid-template-columns:1.15fr .72fr 1.15fr;
    gap:12px;
    align-items:center;
}
.contact{
    font-size:17px;
}
.contact p{
    margin:0 0 8px;
}
.contact a{
    color:#d7eeff;
    text-decoration:underline;
}
.contact small{
    color:#c8d5eb;
    font-size:12px;
}
.cert img,
.social img{
    display:block;
    max-width:100%;
    height:auto;
    margin:auto;
}
.cert{
    background:#fff;
    padding:4px;
}
.social{
    text-align:center;
}

/* Responsive: preserve the old visual character, but don't preserve iWeb's breakage. */
@media(max-width:820px){
    .top{padding:18px 18px 12px}
    .main-nav{gap:23px;font-size:16px}
    .brand-row{
        grid-template-columns:1fr 1.05fr;
        gap:18px;
    }
    .award{font-size:27px}
    .big-phone{font-size:34px}
    .since{font-size:18px}
    .hero-menu{display:none}
    .hero-transition{height:105px}
    .hero-transition img{width:74%}
    .slate{font-size:16px}
    .intro-grid{
        grid-template-columns:360px 1fr;
        min-height:270px;
    }
    .middle-grid{
        grid-template-columns:370px 1fr 180px;
    }
    .footer-title{font-size:21px}
}
@media(max-width:640px){
    .main-nav{gap:14px 19px;font-size:14px}
    .brand-row{grid-template-columns:1fr;text-align:center}
    .brand-logo img{margin:auto;max-width:480px}
    .brand-copy{padding-bottom:5px}
    .award{font-size:27px}
    .big-phone{font-size:32px}
    .since{font-size:17px}
    .hero-transition{height:80px}
    .hero-transition img{width:86%}
    .slate{padding:20px 16px 0}
    .intro-grid,
    .middle-grid{
        grid-template-columns:1fr;
        min-height:0;
    }
    .intro-spacer{display:none}
    .canvas-art{max-width:390px}
    .middle-grid{gap:14px;margin-top:25px}
    .movie-link,.cant-see{text-align:left;padding:0}
    .sustainability{margin-top:28px}
    .recent-strip{
        margin-left:-16px;
        margin-right:-16px;
        flex-direction:column;
        align-items:flex-start;
    }
    .recent-strip>a{align-self:stretch;text-align:center}
    .footer-grid{grid-template-columns:1fr}
    .cert,.social{max-width:380px;margin:8px auto;width:100%}
}


/* 0.4 — restored social block + Mark's bottom navigation */
.social-grid{
    display:grid;
    grid-template-columns:repeat(3,minmax(60px,1fr));
    gap:10px;
    max-width:330px;
    margin:0 auto;
}
.social-grid a{
    min-height:64px;
    display:flex;
    align-items:center;
    justify-content:center;
    border-radius:7px;
    background:linear-gradient(#fff,#e6e6e6);
    color:#17477a;
    font-weight:800;
    font-size:28px;
    text-decoration:none;
    box-shadow:0 1px 3px rgba(0,0,0,.35);
}
.social-grid a:nth-child(1){color:#2f5fa7}
.social-grid a:nth-child(2){color:#a84184}
.social-grid a:nth-child(3){color:#c8332b}
.social-grid a:nth-child(4){color:#c9262f}
.social-grid a:nth-child(5){color:#1677a7;font-size:21px}
.social-grid a.houzz{
    grid-column:span 3;
    min-height:54px;
    background:linear-gradient(#8ed33e,#6fbd2f);
    color:#fff;
    font-size:25px;
    letter-spacing:.5px;
}

.bottom-nav{
    margin:22px -20px -22px;
    padding:12px 16px;
    display:flex;
    flex-wrap:wrap;
    justify-content:center;
    gap:0;
    background:linear-gradient(180deg,#31589a,#153d80);
    border-top:1px solid rgba(255,255,255,.28);
    box-shadow:inset 0 1px rgba(255,255,255,.08);
}
.bottom-nav a{
    position:relative;
    color:#d9e8ff;
    text-decoration:none;
    padding:5px 13px;
    font-size:14px;
}
.bottom-nav a + a::before{
    content:"";
    position:absolute;
    left:0;
    top:6px;
    bottom:6px;
    width:1px;
    background:rgba(255,255,255,.25);
}
.bottom-nav a:hover,
.bottom-nav a.active{
    color:#fff;
    text-decoration:underline;
}

@media(max-width:640px){
    .social-grid{max-width:360px}
    .bottom-nav{gap:2px 0}
    .bottom-nav a{padding:6px 10px}
}


/* 0.5 — crisp DBM treatment, transparent canvas quote, restored movie player */
.hero-transition{
    height:126px;
}
.dbm{
    width:min(78%,820px);
    display:flex;
    justify-content:center;
    align-items:center;
    gap:clamp(18px,4vw,48px);
    color:#fff;
    font-family:Georgia,"Times New Roman",serif;
    font-size:clamp(28px,4.3vw,52px);
    font-weight:400;
    letter-spacing:.01em;
    line-height:1;
    text-shadow:
        0 1px 0 rgba(255,255,255,.22),
        0 2px 3px rgba(0,0,0,.55);
}
.dbm i{
    font-style:normal;
    font-size:.55em;
    opacity:.9;
}

.canvas-art{
    margin-top:22px;
    background:transparent !important;
}
.canvas-quote{
    display:inline-flex;
    flex-direction:column;
    align-items:center;
    padding:0;
    background:transparent;
    color:#fff;
    text-align:center;
    text-shadow:0 2px 3px rgba(0,0,0,.5);
}
.canvas-quote span{
    font-family:Georgia,"Times New Roman",serif;
    font-size:17px;
    font-style:italic;
}
.canvas-quote strong{
    margin-top:4px;
    font-family:"Snell Roundhand","Apple Chancery","URW Chancery L",cursive;
    font-size:30px;
    font-weight:400;
    line-height:1.05;
}

.movie-link{
    align-self:end;
}
.movie-player{
    width:min(100%,420px);
    margin:0 auto;
}
.movie-player video{
    display:block;
    width:100%;
    aspect-ratio:16/9;
    object-fit:cover;
    background:#111;
    border:1px solid rgba(255,255,255,.32);
    box-shadow:0 3px 12px rgba(0,0,0,.42);
}
.movie-caption{
    margin-top:5px;
    color:#e4e7ea;
    font-size:13px;
    text-align:center;
}

@media(max-width:640px){
    .hero-transition{height:82px}
    .dbm{
        width:94%;
        gap:14px;
        font-size:clamp(23px,7vw,34px);
    }
    .canvas-quote strong{font-size:26px}
}


/* 0.6 — video, heavier canvas quote, simplified hero nav, social refinement */

/* Top navigation already provides the page links; don't compete with the hero image. */
.hero-menu{
    display:none !important;
}

/* Give the canvas statement the same visual authority as the surrounding copy. */
.canvas-quote{
    width:min(100%,430px);
    margin-top:8px;
    padding:13px 16px 12px;
    border-top:1px solid rgba(255,255,255,.18);
    border-bottom:1px solid rgba(0,0,0,.18);
}
.canvas-quote span{
    font-family:Georgia,"Times New Roman",serif;
    font-size:20px;
    font-style:italic;
    font-weight:700;
    letter-spacing:.01em;
    line-height:1.22;
}
.canvas-quote strong{
    margin-top:5px;
    font-family:"Snell Roundhand","Apple Chancery","URW Chancery L",cursive;
    font-size:35px;
    font-weight:600;
    line-height:1.05;
    text-shadow:
        0 1px 0 rgba(255,255,255,.16),
        0 2px 3px rgba(0,0,0,.55);
}

/* Use formerly dead movie space as a deliberate feature block. */
.featured-video{
    width:min(100%,460px);
    margin:0 auto;
    text-align:center;
}
.video-kicker{
    color:#dceaf5;
    font-family:Georgia,"Times New Roman",serif;
    font-size:22px;
    font-weight:700;
    letter-spacing:.035em;
    text-shadow:0 2px 2px rgba(0,0,0,.35);
}
.video-title{
    margin:3px 0 10px;
    color:#fff;
    font-size:14px;
    font-weight:600;
    letter-spacing:.08em;
    text-transform:uppercase;
    opacity:.82;
}
.movie-player{
    width:100%;
    margin:0 auto;
}
.movie-player iframe{
    display:block;
    width:100%;
    aspect-ratio:16/9;
    border:1px solid rgba(255,255,255,.36);
    background:#111;
    box-shadow:0 4px 16px rgba(0,0,0,.48);
}
.movie-caption{
    margin-top:6px;
    font-size:13px;
    color:#e8edf1;
}
.cant-see{
    align-self:end;
    padding-bottom:10px;
    font-size:13px;
}
.cant-see a{
    color:#d9f1ff;
    text-decoration:underline;
}

/* More substantial social buttons: charcoal tiles, larger clear marks. */
.social-heading{
    margin-bottom:11px;
    text-align:center;
    color:#e9f2ff;
    font-size:14px;
    font-weight:700;
    letter-spacing:.02em;
}
.social-grid{
    display:grid;
    grid-template-columns:repeat(3,minmax(76px,1fr));
    gap:10px;
    max-width:370px;
    margin:0 auto;
}
.social-grid .social-button{
    min-height:82px;
    padding:8px 6px 7px;
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;
    gap:3px;
    border-radius:8px;
    border:1px solid rgba(255,255,255,.25);
    background:
        linear-gradient(180deg,rgba(69,84,99,.96),rgba(33,45,58,.98));
    color:#fff;
    text-decoration:none;
    box-shadow:
        inset 0 1px rgba(255,255,255,.10),
        0 2px 5px rgba(0,0,0,.34);
}
.social-grid .social-button:hover{
    background:
        linear-gradient(180deg,rgba(82,101,119,.98),rgba(40,56,71,.99));
    border-color:rgba(255,255,255,.45);
}
.social-mark{
    min-height:42px;
    display:flex;
    align-items:center;
    justify-content:center;
    font-size:39px;
    font-weight:900;
    line-height:1;
}
.social-name{
    font-size:12px;
    font-weight:700;
    color:#dce7f2;
}
.social-button.youtube .social-mark{color:#ff4a43}
.social-button.houzz .social-mark{color:#8bc53f}
.social-button.hometalk .social-mark{color:#59b9d4}
.social-button.facebook .social-mark{color:#79a9ed}
.social-button.pinterest .social-mark{color:#ef5a65}
.social-button.instagram .social-mark{color:#e28bc5}

@media(max-width:820px){
    .middle-grid{
        grid-template-columns:minmax(340px,1fr) minmax(330px,1.1fr);
        align-items:start;
    }
    .cant-see{
        grid-column:2;
        text-align:center;
        padding-top:3px;
    }
}
@media(max-width:640px){
    .canvas-quote{
        width:100%;
    }
    .canvas-quote span{font-size:18px}
    .canvas-quote strong{font-size:30px}
    .middle-grid{
        grid-template-columns:1fr;
    }
    .cant-see{
        grid-column:auto;
        text-align:center;
    }
    .social-grid{
        grid-template-columns:repeat(2,minmax(90px,1fr));
        max-width:360px;
    }
}


/* 0.7 — clean familiar social icon tiles + video/quote balance */
.dbm{
    justify-content:space-between;
    gap:0;
    width:min(72%,760px);
}
.dbm i{display:none!important}

/* A little more authority without recreating the old dark raster box. */
.canvas-quote{
    align-items:flex-start;
    text-align:left;
    padding-left:0;
    padding-right:0;
}
.canvas-quote span{
    font-size:21px;
    font-weight:800;
}
.canvas-quote strong{
    font-size:37px;
    font-weight:700;
}

/* Give the video feature more of the available right-hand space. */
.featured-video{
    width:min(100%,520px);
}
.video-kicker{
    font-size:24px;
}
.video-title{
    margin-bottom:8px;
}

/* Completely isolated 0.7 social grid. Legacy .social-grid rules cannot interfere. */
.social-v07 .social-heading{
    margin:0 0 12px;
    text-align:center;
    color:#fff;
    font-size:14px;
    font-weight:600;
}
.social-v07 .social-icon-grid{
    display:grid;
    grid-template-columns:repeat(3,88px);
    gap:10px;
    justify-content:center;
    align-items:center;
}
.social-v07 .social-tile{
    box-sizing:border-box;
    width:88px;
    height:72px;
    display:flex;
    align-items:center;
    justify-content:center;
    overflow:hidden;
    background:#fff;
    border:1px solid rgba(255,255,255,.82);
    border-radius:8px;
    box-shadow:
        inset 0 1px 0 rgba(255,255,255,.9),
        0 2px 6px rgba(0,0,0,.32);
    text-decoration:none!important;
    transition:transform .12s ease, box-shadow .12s ease;
}
.social-v07 .social-tile:hover{
    transform:translateY(-2px);
    box-shadow:
        inset 0 1px 0 rgba(255,255,255,.95),
        0 5px 10px rgba(0,0,0,.38);
}

/* Familiar service marks, deliberately large and uncluttered. */
.yt-mark{
    width:58px;
    height:40px;
    display:flex;
    align-items:center;
    justify-content:center;
    background:#ff0033;
    border-radius:10px;
}
.yt-triangle{
    width:0;height:0;
    border-top:10px solid transparent;
    border-bottom:10px solid transparent;
    border-left:17px solid #fff;
    margin-left:4px;
}
.fb-mark{
    font-family:Arial,Helvetica,sans-serif;
    font-size:60px;
    line-height:1;
    font-weight:900;
    color:#1877f2;
    transform:translateY(7px);
}
.pin-mark{
    width:48px;height:48px;
    display:flex;align-items:center;justify-content:center;
    border-radius:50%;
    background:#e60023;
    color:#fff;
    font-family:Georgia,"Times New Roman",serif;
    font-size:36px;
    font-weight:700;
    font-style:italic;
}
.in-mark{
    width:52px;height:52px;
    display:flex;align-items:center;justify-content:center;
    border-radius:5px;
    background:#0a66c2;
    color:#fff;
    font-family:Arial,Helvetica,sans-serif;
    font-size:29px;
    font-weight:800;
    letter-spacing:-2px;
}
.houzz-mark{
    color:#7ac142;
    font-family:Arial,Helvetica,sans-serif;
    font-size:58px;
    line-height:1;
    font-weight:900;
}
.social-v07 .hometalk img{
    width:56px;
    height:56px;
    object-fit:contain;
    image-rendering:auto;
}

@media(max-width:760px){
    .dbm{
        width:88%;
    }
    .social-v07 .social-icon-grid{
        grid-template-columns:repeat(3,80px);
        gap:8px;
    }
    .social-v07 .social-tile{
        width:80px;height:68px;
    }
}
@media(max-width:520px){
    .dbm{
        width:94%;
    }
    .social-v07 .social-icon-grid{
        grid-template-columns:repeat(2,88px);
    }
}


/* 0.8 — balanced content composition based on approved mockup */

.content-grid{
    display:grid;
    grid-template-columns:minmax(0,.78fr) minmax(0,1.22fr);
    gap:48px;
    align-items:start;
    padding-top:6px;
}

.copy-column{
    min-width:0;
}
.copy-column p{
    margin:0;
}
.intro-copy,
.middle-copy{
    max-width:100%;
}

.gold-rule{
    height:2px;
    background:linear-gradient(90deg,#d7a62a,#f0c95b,#d7a62a);
    border-radius:999px;
    box-shadow:0 0 0 1px rgba(0,0,0,.05);
}
.gold-rule.short{
    width:48%;
    margin:28px 0 32px;
}
.gold-rule.ornamental{
    width:76%;
    margin:14px auto 0;
    position:relative;
}
.gold-rule.ornamental::after{
    content:"✦";
    position:absolute;
    left:50%;
    top:50%;
    transform:translate(-50%,-50%);
    background:#46515d;
    color:#e2b13f;
    padding:0 11px;
    font-size:18px;
}
.sustainability-rule{
    width:66%;
    margin:0 0 12px;
}

.feature-column{
    min-width:0;
    text-align:center;
}
.hero-quote{
    width:100%;
    max-width:none;
    margin:0 0 20px;
    padding:0;
    border:0;
    align-items:center;
    text-align:center;
}
.hero-quote span{
    font-family:Georgia,"Times New Roman",serif;
    font-size:25px;
    font-weight:700;
    font-style:italic;
    color:#e2b13f;
    line-height:1.2;
}
.hero-quote strong{
    margin-top:5px;
    font-family:"Snell Roundhand","Apple Chancery","URW Chancery L",cursive;
    font-size:clamp(54px,6vw,82px);
    font-weight:500;
    line-height:.9;
    color:#fff;
    text-shadow:0 3px 5px rgba(0,0,0,.42);
}

.featured-video{
    width:100%;
    max-width:650px;
    margin:0 auto;
}
.video-kicker{
    margin-bottom:8px;
    font-family:Georgia,"Times New Roman",serif;
    font-size:24px;
    font-weight:400;
    color:#fff;
}
.movie-player iframe{
    width:100%;
    aspect-ratio:16/9;
    border:1px solid rgba(255,255,255,.48);
    box-shadow:0 5px 18px rgba(0,0,0,.45);
}
.more-videos{
    margin-top:10px;
    text-align:center;
    font-size:14px;
    color:#f0f2f5;
}
.more-videos a{
    color:#efc451;
    text-decoration:underline;
    text-underline-offset:2px;
}

.sustainability{
    margin-top:28px;
}
.sustainability h1{
    margin:0 0 4px;
    font-size:29px;
}

/* Footer badge should visually belong to the same card system as the social grid. */
.cert{
    background:#fff;
    padding:8px;
    border-radius:8px;
    box-shadow:
        inset 0 1px 0 rgba(255,255,255,.95),
        0 2px 6px rgba(0,0,0,.32);
}
.cert img{
    border-radius:4px;
}

/* Keep the white icon refrigerator-grid idea, but make it disciplined. */
.social-v07 .social-icon-grid{
    grid-template-columns:repeat(3,88px);
    gap:10px;
}
.social-v07 .social-tile{
    border-radius:8px;
}

/* Preserve Design • Build • Maintain bullets — user preferred them. */
.dbm{
    width:min(74%,780px);
    justify-content:center;
    gap:clamp(18px,3vw,42px);
}
.dbm span:not(:last-child)::after{
    content:"•";
    margin-left:clamp(18px,3vw,42px);
    color:#e4bd4f;
    font-size:.68em;
    vertical-align:.08em;
    text-shadow:none;
}

@media(max-width:820px){
    .content-grid{
        grid-template-columns:1fr;
        gap:28px;
    }
    .feature-column{
        display:flex;
        flex-direction:column;
    }
    .hero-quote{
        order:0;
    }
    .featured-video{
        order:1;
        max-width:620px;
    }
    .gold-rule.short{
        width:34%;
    }
    .sustainability-rule{
        width:78%;
    }
}

@media(max-width:640px){
    .content-grid{
        gap:24px;
    }
    .hero-quote span{
        font-size:19px;
    }
    .hero-quote strong{
        font-size:clamp(46px,15vw,64px);
    }
    .gold-rule.short{
        width:42%;
        margin:22px 0 25px;
    }
    .sustainability h1{
        font-size:24px;
        line-height:1.15;
    }
    .sustainability-rule{
        width:100%;
    }
    .dbm{
        width:96%;
        gap:11px;
    }
    .dbm span:not(:last-child)::after{
        margin-left:11px;
    }
}


/* 0.9 — weighted gold rules, scroll flourishes, gold links, privacy-safe address */

/* Unified RMW gold link treatment */
:root{
    --rmw-gold:#e3b541;
    --rmw-gold-bright:#f0ca5b;
    --rmw-gold-deep:#b98720;
}

a{
    color:var(--rmw-gold-bright);
}
a:hover{
    color:#ffe08a;
}

/* Keep navigation readable and consistent rather than turning every nav item gold. */
.main-nav a,
.bottom-nav a,
.recent-strip>a,
.recent-button{
    color:inherit;
}
.main-nav a.active,
.main-nav a:hover{
    color:#fff;
}

/* Weighted-ended ornamental horizontal rules */
.gold-rule{
    position:relative;
    height:2px;
    border-radius:999px;
    background:
        linear-gradient(
            90deg,
            var(--rmw-gold-deep) 0%,
            var(--rmw-gold-bright) 10%,
            var(--rmw-gold) 50%,
            var(--rmw-gold-bright) 90%,
            var(--rmw-gold-deep) 100%
        );
    box-shadow:
        0 1px 0 rgba(0,0,0,.22),
        0 0 5px rgba(227,181,65,.14);
}

.gold-rule::before,
.gold-rule::after{
    content:"";
    position:absolute;
    top:50%;
    width:11px;
    height:11px;
    border-radius:50%;
    background:var(--rmw-gold-bright);
    box-shadow:
        0 0 0 1px rgba(100,62,0,.28),
        0 1px 3px rgba(0,0,0,.28);
    transform:translateY(-50%);
}
.gold-rule::before{left:-2px}
.gold-rule::after{right:-2px}

/* Central scroll-flourish for the prominent rules */
.gold-rule.ornamental::after{
    content:"❧";
    left:50%;
    right:auto;
    top:50%;
    width:auto;
    height:auto;
    min-width:58px;
    padding:0 12px 2px;
    border-radius:999px;
    transform:translate(-50%,-50%);
    display:flex;
    align-items:center;
    justify-content:center;
    background:#46515d;
    color:var(--rmw-gold-bright);
    font-family:Georgia,"Times New Roman",serif;
    font-size:31px;
    line-height:1;
    box-shadow:none;
}
.gold-rule.ornamental::before{
    left:-2px;
}

/* Sustainability gets weighted ends and a smaller centered flourish */
.sustainability-rule{
    position:relative;
    overflow:visible;
}
.sustainability-rule::after{
    right:-2px;
}
.sustainability-rule::before{
    left:-2px;
}
.sustainability-rule{
    margin-bottom:14px;
}
.sustainability-rule span{
    display:none;
}

/* Add a subtle scroll flourish without interrupting the title. */
.sustainability-rule{
    background:
        linear-gradient(
            90deg,
            var(--rmw-gold-bright) 0%,
            var(--rmw-gold) 48%,
            var(--rmw-gold) 52%,
            var(--rmw-gold-bright) 100%
        );
}
.sustainability-rule:after{
    content:"";
}

/* Separate flourish centered just below Sustainability title line */
.sustainability{
    position:relative;
}
.sustainability::before{
    content:"❧";
    position:absolute;
    left:50%;
    top:37px;
    transform:translateX(-50%);
    z-index:2;
    padding:0 10px 2px;
    background:#46515d;
    color:var(--rmw-gold-bright);
    font-family:Georgia,"Times New Roman",serif;
    font-size:23px;
    line-height:1;
}

/* More-videos and footer utility links use the same gold language */
.more-videos a,
.contact a,
.legacy-footer a{
    color:var(--rmw-gold-bright);
    text-decoration-color:rgba(240,202,91,.72);
    text-underline-offset:2px;
}
.more-videos a:hover,
.contact a:hover,
.legacy-footer a:hover{
    color:#ffe08a;
}

/* Explicitly non-interactive business address */
.private-address{
    color:inherit;
    text-decoration:none;
    cursor:default;
}

/* Keep Recent Work action blue so it remains a clear CTA */
.recent-strip>a,
.recent-button{
    color:#fff !important;
}

/* Bottom navigation gets subtle gold separators to echo the rules */
.bottom-nav a + a::before{
    background:var(--rmw-gold);
    opacity:.72;
}

/* Small-screen tuning so weighted ends and flourishes don't crowd edges */
@media(max-width:640px){
    .gold-rule::before,
    .gold-rule::after{
        width:9px;
        height:9px;
    }
    .gold-rule.ornamental::after{
        min-width:46px;
        font-size:25px;
    }
    .sustainability::before{
        top:58px;
        font-size:20px;
    }
}


/* 1.0 — balanced left copy + unified gold rule language */

/* Add enough copy weight to balance the feature column without feeling padded. */
.design-philosophy{
    margin-top:22px !important;
    color:#eef1f3;
}

/* Top horizontal divider becomes gold and belongs to the same visual system. */
.nav-rule span{
    background:linear-gradient(
        90deg,
        var(--rmw-gold-deep),
        var(--rmw-gold-bright) 12%,
        var(--rmw-gold) 50%,
        var(--rmw-gold-bright) 88%,
        var(--rmw-gold-deep)
    ) !important;
    height:2px;
}
.nav-rule::before,
.nav-rule::after{
    background:var(--rmw-gold-bright) !important;
    width:8px;
    height:8px;
}

/* Standardize all gold rules: no endpoint balls/barbells. */
.gold-rule::before,
.gold-rule::after{
    display:none !important;
}

/* Left-column rule: longer and visually centered under the text mass. */
.gold-rule.short{
    width:64% !important;
    margin:28px auto 32px !important;
}

/* Keep the center flourish on ornamental rules only. */
.gold-rule.ornamental::after{
    display:flex !important;
    content:"❧";
    left:50%;
    right:auto;
    top:50%;
    width:auto;
    height:auto;
    min-width:58px;
    padding:0 12px 2px;
    border-radius:999px;
    transform:translate(-50%,-50%);
    align-items:center;
    justify-content:center;
    background:#46515d;
    color:var(--rmw-gold-bright);
    font-family:Georgia,"Times New Roman",serif;
    font-size:31px;
    line-height:1;
    box-shadow:none;
}

/* Sustainability uses the same uninterrupted weighted line, with a separate flourish. */
.sustainability-rule::before,
.sustainability-rule::after{
    display:none !important;
}

/* Make the top divider end dots slightly subtler than the old white treatment. */
.nav-rule::before,
.nav-rule::after{
    box-shadow:0 0 0 1px rgba(90,55,0,.22);
}

@media(max-width:640px){
    .gold-rule.short{
        width:72% !important;
    }
    .design-philosophy{
        margin-top:18px !important;
    }
}


/* 1.1 — approved arrow-point HR treatment + left-column copy labels */

/* Gold HRs use tapered arrow-point ends, never round barbells. */
.gold-rule{
    position:relative;
    height:2px;
    border-radius:0;
    background:
        linear-gradient(
            90deg,
            rgba(227,181,65,0) 0%,
            var(--rmw-gold-deep) 5%,
            var(--rmw-gold-bright) 14%,
            var(--rmw-gold) 50%,
            var(--rmw-gold-bright) 86%,
            var(--rmw-gold-deep) 95%,
            rgba(227,181,65,0) 100%
        );
    box-shadow:none;
    overflow:visible;
}

/* Draw a small tapered spear-point at each end. */
.gold-rule::before,
.gold-rule::after{
    display:block !important;
    content:"";
    position:absolute;
    top:50%;
    width:0;
    height:0;
    background:none !important;
    border-radius:0 !important;
    box-shadow:none !important;
    transform:translateY(-50%);
}
.gold-rule::before{
    left:-1px;
    border-top:3px solid transparent;
    border-bottom:3px solid transparent;
    border-right:12px solid var(--rmw-gold-bright);
}
.gold-rule::after{
    right:-1px;
    border-top:3px solid transparent;
    border-bottom:3px solid transparent;
    border-left:12px solid var(--rmw-gold-bright);
}

/* Prominent ornamental rules retain the centered scroll flourish. */
.gold-rule.ornamental::after{
    display:flex !important;
    content:"❧";
    position:absolute;
    left:50%;
    right:auto;
    top:50%;
    width:auto;
    height:auto;
    min-width:58px;
    padding:0 12px 2px;
    border:0;
    transform:translate(-50%,-50%);
    align-items:center;
    justify-content:center;
    background:#46515d !important;
    color:var(--rmw-gold-bright);
    font-family:Georgia,"Times New Roman",serif;
    font-size:31px;
    line-height:1;
    box-shadow:none !important;
}

/* Add the right arrow point separately for ornamental rules. */
.gold-rule.ornamental{
    --orn-end: var(--rmw-gold-bright);
}
.gold-rule.ornamental > span{
    display:none;
}
.gold-rule.ornamental::before{
    left:-1px;
    border-top:3px solid transparent;
    border-bottom:3px solid transparent;
    border-right:12px solid var(--rmw-gold-bright);
}

/* Since ::after is used by the flourish, create the right arrow with a pseudo
   on the parent container's box shadow substitute: a clip-path cap. */
.hero-quote .gold-rule.ornamental{
    clip-path:polygon(
        0 50%,
        12px 0,
        calc(100% - 12px) 0,
        100% 50%,
        calc(100% - 12px) 100%,
        12px 100%
    );
}

/* Sustainability: centered beneath the heading text, tapered ends, centered flourish. */
.sustainability{
    text-align:left;
}
.sustainability h1{
    width:max-content;
    max-width:100%;
}
.sustainability-rule{
    width:min(74%, 760px) !important;
    margin:0 auto 14px !important;
    position:relative;
}
.sustainability-rule::before{
    display:block !important;
    left:-1px;
    border-top:3px solid transparent;
    border-bottom:3px solid transparent;
    border-right:12px solid var(--rmw-gold-bright);
}
.sustainability-rule::after{
    display:block !important;
    content:"";
    right:-1px;
    left:auto;
    width:0;
    height:0;
    min-width:0;
    padding:0;
    background:none !important;
    border-top:3px solid transparent;
    border-bottom:3px solid transparent;
    border-left:12px solid var(--rmw-gold-bright);
    transform:translateY(-50%);
}
.sustainability::before{
    content:"❧";
    top:37px;
}

/* Top divider also gets tapered gold ends, no round dots. */
.nav-rule::before,
.nav-rule::after{
    width:0 !important;
    height:0 !important;
    border-radius:0 !important;
    background:none !important;
    box-shadow:none !important;
    top:14px;
}
.nav-rule::before{
    left:0;
    border-top:4px solid transparent;
    border-bottom:4px solid transparent;
    border-right:14px solid var(--rmw-gold-bright);
}
.nav-rule::after{
    right:0;
    border-top:4px solid transparent;
    border-bottom:4px solid transparent;
    border-left:14px solid var(--rmw-gold-bright);
}
.nav-rule span{
    left:10px;
    right:10px;
}

/* Left column: no extra flourishes, just clean gold subheads and simple separators. */
.copy-subhead{
    margin:18px 0 8px;
    color:var(--rmw-gold-bright);
    font-family:Georgia,"Times New Roman",serif;
    font-size:20px;
    font-weight:600;
    line-height:1.15;
}
.middle-copy .copy-subhead:first-child{
    margin-top:0;
}
.design-philosophy{
    margin-top:0 !important;
}

/* Keep the simple centered line between left-column text groups without a flourish. */
.gold-rule.short{
    width:64% !important;
    margin:24px auto 28px !important;
}

/* Ensure the approved page remains stable on phones. */
@media(max-width:640px){
    .copy-subhead{
        font-size:18px;
    }
    .sustainability h1{
        width:auto;
    }
    .sustainability-rule{
        width:88% !important;
    }
    .sustainability::before{
        top:58px;
    }
}

/* About proof-of-concept additions */
.about-page .main-nav a.active{font-weight:700;color:#fff}
.about-hero{
    position:relative;
    min-height:360px;
    overflow:hidden;
    background:#25313b;
    display:grid;
    grid-template-columns:1.05fr .95fr;
}
.about-hero .hero-photo{
    width:100%;height:100%;object-fit:cover;display:block;min-height:360px;
}
.about-hero-copy{
    display:flex;flex-direction:column;justify-content:center;
    padding:42px 46px;
    background:linear-gradient(135deg,#3e4b58 0%,#485664 70%,#39444f 100%);
}
.about-hero-copy .eyebrow{font-family:Georgia,"Times New Roman",serif;font-size:19px;color:#dfe8ee;margin-bottom:9px}
.about-hero-copy h1{font-family:Georgia,"Times New Roman",serif;font-size:42px;line-height:1.08;font-weight:400;margin:0 0 13px}
.about-hero-copy p{font-size:18px;margin:0;color:#eef2f4}
.about-body{padding-top:34px}
.about-intro{display:grid;grid-template-columns:1.2fr .8fr;gap:34px;align-items:start}
.about-copy h2,.about-section h2{font-family:Georgia,"Times New Roman",serif;font-weight:400;font-size:29px;margin:0 0 10px}
.about-copy p{margin:0 0 15px}
.about-side-photo{margin:0;background:#33404b;padding:8px;border:1px solid rgba(255,255,255,.18)}
.about-side-photo img{display:block;width:100%;height:auto}
.about-side-photo figcaption{font-size:12px;color:#dce3e7;padding:7px 2px 1px}
.about-columns{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin-top:26px}
.about-card{background:#3b4854;border-top:2px solid #d0b06c;padding:18px 18px 16px;box-shadow:0 2px 8px rgba(0,0,0,.18)}
.about-card h3{font-family:Georgia,"Times New Roman",serif;font-weight:400;font-size:22px;margin:0 0 9px}
.about-card ul{margin:0;padding-left:20px}
.about-card li{margin:0 0 7px}
.about-section{margin-top:28px}
.about-section p{margin:0 0 14px}
.about-awards{columns:2;column-gap:36px;margin:8px 0 0;padding-left:20px}
.about-awards li{break-inside:avoid;margin-bottom:8px}
.asset-note{font-size:12px;color:#d6dde2;margin-top:6px}
@media(max-width:760px){
    .about-hero{grid-template-columns:1fr}
    .about-hero-copy{padding:30px 24px}
    .about-hero-copy h1{font-size:34px}
    .about-intro{grid-template-columns:1fr}
    .about-columns{grid-template-columns:1fr}
    .about-awards{columns:1}
}


/* About static preview v2 — restore legacy credentials and waterfall into content flow */
.about-credentials{
    display:grid;grid-template-columns:1.25fr .75fr;gap:30px;align-items:center;
    margin-top:28px;padding:24px 26px;
    background:#35424e;border-top:1px solid rgba(208,176,108,.9);border-bottom:1px solid rgba(208,176,108,.45);
    box-shadow:inset 0 1px 0 rgba(255,255,255,.04);
}
.about-credentials .eyebrow{
    color:var(--rmw-gold-bright);font-family:Georgia,"Times New Roman",serif;font-size:16px;letter-spacing:.03em;margin-bottom:6px;
}
.about-credentials h2{
    font-family:Georgia,"Times New Roman",serif;font-weight:400;font-size:27px;line-height:1.15;margin:0 0 9px;
}
.about-credentials p{margin:0;max-width:720px}
.credential-marks{display:flex;align-items:center;justify-content:center;gap:20px;flex-wrap:wrap}
.credential-mark{margin:0;background:#fff;padding:8px;box-shadow:0 3px 12px rgba(0,0,0,.26)}
.credential-mark img{display:block;max-width:100%;height:auto}
.credential-mark.wide{width:min(263px,70%)}
.credential-mark.badge{width:117px}
.about-awards-flow{
    display:grid;grid-template-columns:1.05fr .95fr;gap:30px;align-items:center;
}
.about-awards-flow .sustainability-rule{margin-left:0 !important;margin-right:auto !important;width:min(88%,560px) !important}
.about-awards-flow .about-awards{columns:1;margin-top:12px}
.about-waterfall{
    margin:0;background:#27333d;padding:8px;border:1px solid rgba(255,255,255,.17);box-shadow:0 4px 16px rgba(0,0,0,.24);
}
.about-waterfall img{display:block;width:100%;height:auto}
@media(max-width:820px){
    .about-credentials{grid-template-columns:1fr;padding:22px 20px}
    .credential-marks{justify-content:flex-start}
    .about-awards-flow{grid-template-columns:1fr}
    .about-awards-flow .sustainability-rule{margin-left:auto !important;margin-right:auto !important}
}
@media(max-width:480px){
    .credential-mark.wide{width:100%}
    .credential-mark.badge{width:105px}
}

/* About static preview v3 — moss-green exterior gutters */
:root{
    --gutter-moss:#3f5038;
    --gutter-moss-dark:#273326;
    --gutter-moss-light:#596a4e;
}
html{
    background:var(--gutter-moss-dark);
}
body{
    background:
        radial-gradient(ellipse at 50% -8%,
            var(--gutter-moss-light) 0%,
            var(--gutter-moss) 34%,
            #354330 66%,
            var(--gutter-moss-dark) 100%);
    background-attachment:fixed;
}
.site{
    box-shadow:
        0 0 30px rgba(0,0,0,.70),
        0 0 0 1px rgba(221,198,126,.10),
        inset 0 1px rgba(255,255,255,.08);
}

/* Keep credentials, awards and legacy waterfall clearly in the reading flow. */
.about-credentials{
    margin-bottom:28px;
}
.about-awards-flow{
    margin-top:30px;
    margin-bottom:34px;
}
.about-waterfall figcaption{
    margin-top:7px;
    color:rgba(255,255,255,.72);
    font-size:13px;
    line-height:1.25;
}


/* About static preview v4 — corrected gutters and tighter content flow */
html, body{min-height:100%;}
html{background:#263324 !important;}
body.about-page,
body{
    background:linear-gradient(90deg,#2b3b29 0%,#45563b 14%,#536347 50%,#45563b 86%,#2b3b29 100%) fixed !important;
}
.site{
    box-shadow:0 0 28px rgba(0,0,0,.72),0 0 0 1px rgba(225,196,116,.12),inset 0 1px rgba(255,255,255,.08) !important;
}
.about-body{padding-top:28px;}
.about-credentials{
    grid-template-columns:minmax(0,1.35fr) minmax(260px,.65fr);
    gap:24px;
    align-items:center;
    margin:24px 0 20px;
    padding:20px 24px;
}
.credential-marks{
    display:grid;
    grid-template-columns:minmax(170px,1fr) 105px;
    gap:14px;
    justify-content:end;
    align-items:center;
}
.credential-mark.wide{width:100%;max-width:260px;justify-self:end;}
.credential-mark.badge{width:105px;justify-self:end;}
.about-columns{margin-top:20px;}
.display-ponds{
    margin-top:18px;
    display:grid;
    grid-template-columns:.72fr 1.28fr;
    gap:26px;
    align-items:start;
    padding:18px 20px 15px;
}
.display-ponds h3{margin-bottom:6px;}
.display-ponds p{margin:0;color:#e6ebee;}
.display-ponds ul{
    columns:2;
    column-gap:32px;
    margin:0;
    padding-left:20px;
}
.display-ponds li{break-inside:avoid;margin:0 0 7px;}
.about-awards-flow{
    grid-template-columns:minmax(0,1.15fr) minmax(300px,.85fr);
    gap:26px;
    align-items:start;
    margin-top:22px;
    margin-bottom:24px;
}
.about-awards-flow .about-awards{
    columns:2;
    column-gap:30px;
    margin-top:10px;
}
.about-waterfall{align-self:start;}
.about-waterfall img{width:100%;height:auto;}
.about-waterfall figcaption{font-size:12px;}
@media(max-width:820px){
    .about-credentials{grid-template-columns:1fr;}
    .credential-marks{grid-template-columns:minmax(160px,260px) 105px;justify-content:start;}
    .credential-mark.wide,.credential-mark.badge{justify-self:start;}
    .display-ponds{grid-template-columns:1fr;}
    .display-ponds ul{columns:1;}
    .about-awards-flow{grid-template-columns:1fr;}
    .about-awards-flow .about-awards{columns:1;}
}

/* === SHARED SHELL v1 === */
html,
body{
    background:#344a2e;
}
body{
    background-image:radial-gradient(ellipse at 50% -20%,#4c643f 0%,#344a2e 48%,#263820 100%);
}
.site{
    box-shadow:0 0 28px rgba(0,0,0,.72), inset 0 1px rgba(255,255,255,.08);
}
.footer-grid{
    grid-template-columns:1.15fr .72fr 1.15fr;
    align-items:center;
    column-gap:26px;
}
.footer-grid .cert{
    justify-self:center;
    width:min(100%,250px);
    padding:4px;
}
.footer-grid .cert img{width:100%;height:auto}
.footer-grid .social{
    justify-self:center;
    width:100%;
    max-width:360px;
}
.social-icon-grid{margin-left:auto;margin-right:auto}
@media(max-width:760px){
    .footer-grid .cert,.footer-grid .social{justify-self:center;max-width:380px;width:100%}
}

/* 1.0 — shared-shell v2: cross-browser responsive header/footer */

/* Moss gutters remain visible whenever the viewport is wider than the page shell. */
html{
    background:#2f482e;
}
body{
    min-width:320px;
    background:
        linear-gradient(90deg,#263c27 0%,#3f5b35 8%,#526d3c 18%,#3f5b35 30%,#263c27 46%,#334b2f 62%,#4b6538 82%,#2a412a 100%);
}

/* Make the service-area statement deterministic instead of browser-dependent. */
.since .service-line,
.since .since-line{
    display:block;
}
.since .service-line{
    white-space:nowrap;
}

/* Footer columns get explicit visual jobs. */
.footer-grid .contact{grid-area:contact}
.footer-grid .cert{grid-area:cert}
.footer-grid .social{grid-area:social}
.footer-grid{
    grid-template-areas:"contact cert social";
}
.cert{
    width:min(100%,230px);
    justify-self:center;
}
.social-v07{
    justify-self:center;
    width:100%;
}

/* Laptop / tablet landscape / iPad portrait class widths.
   Avoid device sniffing: the layout changes only when the available CSS width requires it. */
@media (max-width:1050px){
    .top{
        padding-left:20px;
        padding-right:20px;
    }
    .main-nav{
        gap:18px 25px;
        font-size:16px;
    }
    .brand-row{
        grid-template-columns:minmax(330px,.95fr) minmax(390px,1.05fr);
        gap:20px;
    }
    .award{font-size:30px}
    .big-phone{font-size:36px}
    .since{
        font-size:18px;
        max-width:none;
    }

    .footer-grid{
        grid-template-columns:minmax(0,1fr) minmax(250px,.85fr);
        grid-template-areas:
            "contact contact"
            "cert social";
        gap:18px 30px;
        align-items:center;
    }
    .contact{
        display:grid;
        grid-template-columns:repeat(2,minmax(0,1fr));
        column-gap:26px;
        align-items:start;
    }
    .contact p,
    .contact small{
        grid-column:1;
    }
    .contact p:nth-of-type(3),
    .contact p:nth-of-type(4){
        grid-column:2;
    }
    .contact p:nth-of-type(3){grid-row:1}
    .contact p:nth-of-type(4){grid-row:2}
    .contact small{
        margin-top:4px;
    }
    .cert{
        width:220px;
    }
}

/* Narrow tablets and large phones: header stacks cleanly; footer stays balanced. */
@media (max-width:760px){
    .main-nav{
        gap:12px 18px;
        font-size:15px;
    }
    .brand-row{
        grid-template-columns:1fr;
        gap:12px;
        text-align:center;
    }
    .brand-logo img{
        margin:0 auto;
        max-width:500px;
    }
    .award{font-size:27px}
    .big-phone{font-size:33px}
    .since{
        font-size:18px;
        line-height:1.2;
    }
    .since .service-line{
        white-space:normal;
        max-width:620px;
        margin:0 auto;
    }

    .footer-grid{
        grid-template-columns:1fr 1fr;
        grid-template-areas:
            "contact contact"
            "cert social";
        gap:18px;
    }
    .contact{
        grid-template-columns:1fr 1fr;
    }
    .cert{
        width:min(100%,210px);
    }
    .social-v07 .social-icon-grid{
        grid-template-columns:repeat(3,72px);
        gap:8px;
    }
    .social-v07 .social-tile{
        width:72px;
        height:64px;
    }
}

/* Phone layout: no compressed two-column footer. */
@media (max-width:560px){
    .top{padding:14px 14px 10px}
    .main-nav{
        gap:9px 14px;
        font-size:14px;
    }
    .nav-rule{height:20px}
    .award{font-size:24px}
    .big-phone{font-size:30px}
    .since{font-size:16px}

    .footer-title{
        font-size:20px;
        line-height:1.25;
    }
    .footer-grid{
        grid-template-columns:1fr;
        grid-template-areas:
            "contact"
            "cert"
            "social";
    }
    .contact{
        display:block;
    }
    .cert{
        width:210px;
        margin:4px auto 10px;
    }
    .social-v07 .social-icon-grid{
        grid-template-columns:repeat(3,76px);
    }
    .social-v07 .social-tile{
        width:76px;
        height:64px;
    }
}

/* 1.0.1 — shared-shell v2.1: narrow-phone footer correction.
   Keep all six social destinations visible and prevent the certification
   artwork from expanding to card width on small screens. */
@media (max-width:560px){
    .footer-grid{
        gap:18px;
    }
    .cert,
    .footer-grid .cert{
        width:210px !important;
        max-width:210px !important;
        justify-self:center;
        margin:2px auto 8px;
    }
    .cert img,
    .footer-grid .cert img{
        display:block;
        width:100% !important;
        max-width:210px !important;
        height:auto !important;
    }
    .social-v07,
    .footer-grid .social{
        width:100%;
        max-width:none;
        justify-self:stretch;
    }
    .social-v07 .social-icon-grid{
        display:grid !important;
        grid-template-columns:repeat(3,72px) !important;
        grid-auto-flow:row !important;
        gap:9px !important;
        justify-content:center !important;
        align-items:center !important;
    }
    .social-v07 .social-tile{
        display:flex !important;
        visibility:visible !important;
        opacity:1 !important;
        width:72px !important;
        height:62px !important;
    }
    .social-v07 .social-heading{
        margin-bottom:10px;
        text-align:center;
    }
}

/* 1.0.2 — shared-shell v2.2: content-blocker-resistant social controls.
   Platform names and third-party URLs are intentionally absent from the
   clickable anchor classes/markup. Marks remain ordinary first-party HTML. */
@media (max-width:560px){
    .social-v07 .social-icon-grid > .social-tile{
        display:flex !important;
    }
}


/* =========================================================
   RMW SHARED NAV 2.6 — active section + approved arrow rule
   2026-08-26
   ========================================================= */

/* Current page/section uses the Gallery-approved gold treatment. */
.main-nav a.active,
.bottom-nav a.active{
    color:var(--rmw-gold-bright, #f0ca5b) !important;
    font-weight:800 !important;
}

/* Hover remains bright/readable without obscuring current-page state. */
.main-nav a:not(.active):hover,
.bottom-nav a:not(.active):hover{
    color:#fff !important;
}

/* Approved spear/arrow-point divider immediately below the main navigation. */
.nav-rule{
    position:relative;
    height:26px;
}
.nav-rule span{
    position:absolute;
    left:10px !important;
    right:10px !important;
    top:16px !important;
    height:2px !important;
    border-radius:0 !important;
    background:linear-gradient(
        90deg,
        rgba(227,181,65,0) 0%,
        var(--rmw-gold-deep,#b98720) 5%,
        var(--rmw-gold-bright,#f0ca5b) 14%,
        var(--rmw-gold,#e3b541) 50%,
        var(--rmw-gold-bright,#f0ca5b) 86%,
        var(--rmw-gold-deep,#b98720) 95%,
        rgba(227,181,65,0) 100%
    ) !important;
    box-shadow:none !important;
}
.nav-rule::before,
.nav-rule::after{
    display:block !important;
    content:"" !important;
    position:absolute !important;
    top:17px !important;
    width:0 !important;
    height:0 !important;
    background:none !important;
    border-radius:0 !important;
    box-shadow:none !important;
    transform:translateY(-50%) !important;
}
.nav-rule::before{
    left:0 !important;
    border-top:4px solid transparent !important;
    border-bottom:4px solid transparent !important;
    border-right:14px solid var(--rmw-gold-bright,#f0ca5b) !important;
}
.nav-rule::after{
    right:0 !important;
    border-top:4px solid transparent !important;
    border-bottom:4px solid transparent !important;
    border-left:14px solid var(--rmw-gold-bright,#f0ca5b) !important;
}


/* =========================================================
   RMW SHARED BRAND ASSETS 2.7
   Canonical vector logo + clean MCAC badge
   ========================================================= */
.brand-logo img{
    width:min(100%,520px);
    max-height:205px;
    object-fit:contain;
}
.cert{
    display:flex;
    align-items:center;
    justify-content:center;
}
.cert img{
    display:block;
    width:min(100%,190px);
    height:auto;
    max-height:190px;
    object-fit:contain;
    border-radius:0;
}
