:root{--navy:#27485D;--sea:#8AA7AA;--paper:#F9F8F5;--text:#8AA7AA}
body {
    margin: 0;
    min-height: 100vh;
    color: white;
    background:
        linear-gradient(
            rgba(18, 31, 40, 0.45),
            rgba(18, 31, 40, 0.55)
        ),
        url("../assets/img/hero.jpg");
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    background-attachment: fixed;
}
*{box-sizing:border-box}body{margin:0;font-family: "avenir-lt-pro", sans-serif;background:var(--paper);color:var(--paper);display:flex;min-height:100vh;flex-direction:column}
.bg{position:fixed;inset:0;background:url('../img/harbour-window-cleaning-st-mawes-harbour-location.jpg') center/cover no-repeat;opacity:.75;z-index:-1}
.hero{margin:auto;max-width:760px;padding:2rem;text-align:center}
.eyebrow{letter-spacing:.3em;font-size:.75rem;color:var(--sea)}
.hero {
    margin-left: 0;
    background: var(--paper);
    color: var(--navy);
    min-height: 100vh;
    max-width: 760px;
    padding: 2rem;
    text-align: center;
}
h1{font-family:"the-seasons",serif;font-weight:400;color:var(--navy);font-size:clamp(3rem,10vw,5.8rem);line-height:.95;margin: 5rem .3rem 0}
h1 span{font-size:.75em}
h2 {font-family: "avenir-lt-pro", sans-serif;
    font-weight: 700;
    font-style: normal;
    text-transform: uppercase;
    letter-spacing: 4px;
    margin-top: 0px;}
.strap{font-size:1.35rem}.intro{max-width:42rem;margin:1.5rem auto;color:#000;}
.actions{display:flex;gap:1rem;justify-content:center;flex-wrap:wrap;margin:2rem 0}
.btn{padding:.9rem 1.6rem;border:1px solid var(--navy);border-radius:999px;color:var(--navy);text-decoration:none}
.primary{background:var(--navy);color:#fff}
.soon{opacity:.7;font-style:italic}footer{text-align:center;padding:1.5rem;font-size:.9rem;border-top:1px solid #ddd}