/* ---------- Colours & type ---------- */
  :root{
    --navy:#0F2433;      /* harbour navy: text, footer */
    --mist:#EEF3F5;      /* sea mist: alternate sections */
    --white:#FFFFFF;
    --stone:#56636C;     /* boulder grey: secondary text */
    --rule:#D6DEE3;      /* lines */
    --blue:#1F6FD1;      /* buttons & links on light backgrounds */
    --blue-dark:#185BB0;
    --logo-blue:#3B9EFF; /* logo only */
    --head:'Barlow Condensed', 'Arial Narrow', sans-serif;
    --body:'Barlow', 'Segoe UI', Arial, sans-serif;
    --wrap:1160px;
  }
  *{margin:0;padding:0;box-sizing:border-box;}
  html{scroll-behavior:smooth;}
  body{font-family:var(--body);font-size:17px;line-height:1.65;color:var(--navy);background:var(--white);-webkit-font-smoothing:antialiased;}
  img{max-width:100%;display:block;}
  a{color:var(--blue);}
  a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible{outline:3px solid var(--logo-blue);outline-offset:3px;}
  .wrap{max-width:var(--wrap);margin:0 auto;padding:0 28px;}
  h1,h2,h3{font-family:var(--head);font-weight:600;line-height:1.08;letter-spacing:.2px;}
  h2{font-size:clamp(2rem,3.6vw,2.75rem);margin-bottom:18px;}
  h3{font-size:1.45rem;margin-bottom:8px;}
  p{max-width:68ch;}
  .lead{font-size:1.12rem;color:var(--stone);}
  section{padding:96px 0;}
  section,#about{scroll-margin-top:78px;}
  .mist{background:var(--mist);}

  /* ---------- Logo (unchanged wordmark) ---------- */
  .logo{font-family:'Inter',Arial,sans-serif;font-weight:800;font-size:22px;letter-spacing:-.3px;text-decoration:none;color:#fff;white-space:nowrap;}
  .logo span{color:var(--logo-blue);}

  /* ---------- Nav ---------- */
  .nav{position:fixed;top:0;left:0;right:0;z-index:50;transition:background .25s,box-shadow .25s;}
  .nav .wrap{display:flex;align-items:center;justify-content:space-between;height:78px;}
  .nav-links{display:flex;align-items:center;gap:30px;list-style:none;}
  .nav-links a{color:#fff;text-decoration:none;font-weight:500;font-size:15.5px;}
  .nav-links a:hover{color:#cfe3ff;}
  .nav-links .btn{padding:10px 18px;font-size:15px;}
  .nav.solid{background:#fff;box-shadow:0 1px 0 var(--rule);}
  .nav.solid .logo{color:var(--navy);}
  .nav.solid .nav-links a{color:var(--navy);}
  .nav.solid .nav-links a:hover{color:var(--blue);}
  .nav.solid .nav-links a.btn{color:#fff;}
  .menu-btn{display:none;background:none;border:0;color:#fff;cursor:pointer;padding:8px;}
  .nav.solid .menu-btn{color:var(--navy);}

  /* ---------- Buttons ---------- */
  .btn{display:inline-block;background:var(--blue);color:#fff;text-decoration:none;font-weight:600;padding:14px 26px;border-radius:6px;border:2px solid var(--blue);font-family:var(--body);font-size:16px;cursor:pointer;transition:background .2s,border-color .2s;}
  .btn:hover{background:var(--blue-dark);border-color:var(--blue-dark);}
  .btn.ghost{background:transparent;border-color:rgba(255,255,255,.85);color:#fff;}
  .btn.ghost:hover{background:rgba(255,255,255,.12);}
  .btn.line{background:transparent;color:var(--blue);border-color:var(--blue);}
  .btn.line:hover{background:var(--blue);color:#fff;}

  /* ---------- Hero (split: photo with headline | about Blake) ---------- */
  .hero{display:grid;grid-template-columns:1.15fr .85fr;min-height:62vh;padding-top:78px;background:var(--white);}
  .hero-photo{position:relative;display:flex;align-items:center;justify-content:center;min-height:500px;margin:0;color:#fff;padding:56px clamp(20px,4vw,56px);
    background:#2b3338 url('images/hero-tahuna.jpg') center 50%/cover no-repeat;}
  .hero-photo::before{content:"";position:absolute;inset:0;background:rgba(15,36,51,.06);}
  .hero-overlay{position:relative;display:flex;flex-direction:column;align-items:center;text-align:center;width:100%;max-width:460px;}
  .hero-box{background:rgba(15,36,51,.72);padding:24px clamp(18px,2.4vw,30px) 22px;width:100%;}
  .hero h1{font-size:clamp(1.9rem,2.8vw,2.6rem);font-weight:600;line-height:1.06;margin:0 0 10px;color:#fff;letter-spacing:.3px;}
  .hero-box p{font-size:1rem;line-height:1.55;color:rgba(255,255,255,.9);margin:0 auto;max-width:38ch;}
  .hero-actions{display:flex;gap:18px;flex-wrap:wrap;justify-content:center;align-items:center;margin-top:18px;}
  .hero-actions .btn{border-radius:3px;padding:13px 28px;}
  .hero-actions .more{color:#fff;font-weight:600;text-decoration:underline;text-underline-offset:4px;text-shadow:0 1px 6px rgba(0,0,0,.5);}
  .hero-actions .more:hover{text-decoration-thickness:2px;}
  .hero-photo figcaption{position:absolute;right:16px;bottom:14px;z-index:1;font-size:13px;color:#fff;background:rgba(15,36,51,.5);padding:4px 10px;border-radius:999px;}
  .hero-about{display:flex;flex-direction:column;justify-content:center;padding:48px clamp(28px,4vw,60px);background:var(--mist);}
  .hero-about .who{display:grid;grid-template-columns:96px 1fr;gap:2px 18px;align-items:center;margin-bottom:22px;}
  .hero-about .who img{width:96px;height:96px;border-radius:50%;object-fit:cover;object-position:center 30%;border:3px solid #fff;box-shadow:0 4px 14px rgba(15,36,51,.12);grid-row:1 / span 2;}
  .hero-about .who strong{font-family:var(--head);font-size:1.7rem;font-weight:600;line-height:1;align-self:end;}
  .hero-about .who span{color:var(--blue);font-weight:600;font-size:15px;align-self:start;}
  .hero-about h2{font-size:clamp(1.7rem,2.4vw,2.2rem);margin-bottom:14px;}
  .hero-about p{color:var(--stone);margin-bottom:12px;max-width:52ch;font-size:16px;}
  .hero-about p.first{font-size:1.08rem;color:var(--navy);}
  .hero-about .call{margin-top:6px;font-weight:600;color:var(--navy);text-decoration:none;font-size:1.1rem;}
  .hero-about .call:hover{color:var(--blue);}
  @media (prefers-reduced-motion:no-preference){
    .hero-overlay > *,.hero-about > *{animation:rise .8s cubic-bezier(.2,.7,.2,1) both;}
    .hero-overlay > *:nth-child(2){animation-delay:.14s;}
    .hero-about > *{animation-delay:.22s;}
    @keyframes rise{from{opacity:0;transform:translateY(14px);}to{opacity:1;transform:none;}}
  }

  /* ---------- Service sections ---------- */
  .svc-intro{display:grid;grid-template-columns:1.25fr .75fr;gap:56px;align-items:start;}
  .svc-intro.single{grid-template-columns:1fr;max-width:820px;}
  .svc-intro p{color:var(--stone);margin-bottom:14px;}
  .svc-intro p.lead{color:var(--navy);}
  .svc-pic{margin:6px 0 0;}
  .svc-pic img{border:1px solid var(--rule);border-radius:6px;aspect-ratio:900/425;object-fit:cover;object-position:left top;width:100%;}
  .svc-pic figcaption{font-size:14px;color:var(--stone);margin-top:8px;}
  .svc-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:36px 40px;margin-top:48px;}
  .svc{border-top:2px solid var(--navy);padding-top:16px;}
  .svc h3{font-size:1.4rem;}
  .svc p{color:var(--stone);font-size:16px;}
  .svc a{font-weight:600;text-decoration:none;white-space:nowrap;}
  .svc a:hover{text-decoration:underline;}

  /* ---------- Work ---------- */
  .work-head{display:flex;justify-content:space-between;align-items:end;gap:24px;flex-wrap:wrap;margin-bottom:36px;}
  .track{display:flex;gap:28px;overflow-x:auto;scroll-snap-type:x mandatory;scroll-behavior:smooth;scrollbar-width:none;padding-bottom:4px;}
  .track::-webkit-scrollbar{display:none;}
  .track:focus-visible{outline:3px solid var(--logo-blue);outline-offset:6px;}
  .slide{flex:0 0 calc((100% - 56px) / 3);scroll-snap-align:start;margin:0;}
  .slide a{display:block;border-radius:6px;overflow:hidden;border:1px solid var(--rule);background:#fff;}
  .slide img{aspect-ratio:900/425;object-fit:cover;object-position:left top;width:100%;transition:transform .5s;}
  .slide a:hover img{transform:scale(1.03);}
  .slide figcaption{margin-top:12px;font-weight:600;}
  .slide figcaption small{display:block;font-weight:400;color:var(--stone);font-size:14.5px;}
  .car-controls{display:flex;align-items:center;justify-content:center;gap:18px;margin-top:26px;}
  .car-btn{width:44px;height:44px;border-radius:50%;border:1.5px solid var(--navy);background:#fff;color:var(--navy);display:flex;align-items:center;justify-content:center;cursor:pointer;transition:background .2s,color .2s;}
  .car-btn:hover{background:var(--navy);color:#fff;}
  .dots{display:flex;gap:8px;}
  .dots button{width:9px;height:9px;border-radius:50%;border:0;background:#b9c6cd;padding:0;cursor:pointer;}
  .dots button[aria-current="true"]{background:var(--blue);width:22px;border-radius:5px;}
  @media (max-width:900px){ .slide{flex-basis:calc((100% - 28px) / 2);} }
  @media (max-width:560px){ .slide{flex-basis:86%;} .track{gap:16px;} }
  @media (prefers-reduced-motion:reduce){ .track{scroll-behavior:auto;} .slide img{transition:none;} }

  /* ---------- Pricing ---------- */
  .price-cols{display:grid;grid-template-columns:repeat(3,1fr);margin-top:44px;border-top:3px solid var(--navy);}
  .price{padding:34px 30px 36px;border-right:1px solid var(--rule);display:flex;flex-direction:column;}
  .price:first-child{padding-left:0;} .price:last-child{border-right:0;padding-right:0;}
  .price .amount{font-family:var(--head);font-size:3rem;font-weight:700;line-height:1;margin:6px 0 4px;}
  .price .amount small{font-family:var(--body);font-size:15px;font-weight:500;color:var(--stone);}
  .price .for{color:var(--stone);margin-bottom:18px;}
  .price ul{list-style:none;margin-bottom:26px;flex:1;}
  .price li{padding:9px 0;border-bottom:1px solid var(--rule);}
  .price .links{display:flex;flex-direction:column;gap:12px;align-items:flex-start;}
  .price .links a.small{font-weight:600;text-decoration:none;}
  .price .links a.small:hover{text-decoration:underline;}
  .note{margin-top:30px;color:var(--stone);}

  .subhead{margin-top:84px;}
  .existing{display:grid;grid-template-columns:repeat(3,1fr);gap:32px;margin-top:26px;}
  .existing div{border-top:1px solid var(--rule);padding-top:18px;}
  .existing p{color:var(--stone);}

  /* ---------- Plans ---------- */
  .plans{width:100%;min-width:620px;border-collapse:collapse;margin-top:34px;background:#fff;table-layout:fixed;}
  .plans col.feat{width:34%;}
  .plans th,.plans td{text-align:left;vertical-align:top;padding:18px 22px;border-bottom:1px solid var(--rule);}
  .plans thead th{font-family:var(--head);font-size:1.6rem;font-weight:600;border-bottom:3px solid var(--navy);}
  .plans thead th span{display:block;font-family:var(--body);font-size:1rem;color:var(--blue);font-weight:600;}
  .plans tbody th{font-weight:500;color:var(--stone);padding-left:0;}
  .yes{color:var(--navy);font-weight:600;}
  .no{color:#9aa6ad;}
  .plans-table{overflow-x:auto;}
  .small-changes{display:grid;grid-template-columns:1fr 1fr;gap:40px;margin-top:40px;}
  .small-changes p{color:var(--stone);}

  /* ---------- About ---------- */
  .about-grid{max-width:820px;}
  .about-photo img{width:100%;aspect-ratio:4/5;object-fit:cover;border-radius:6px;}
  .about-photo p{margin-top:12px;font-weight:600;}
  .about-photo p small{display:block;font-weight:400;color:var(--stone);}
  .about-text p{margin-bottom:16px;}
  .about-text p:first-of-type{font-size:1.2rem;}

  /* ---------- Contact ---------- */
  .contact-grid{display:grid;grid-template-columns:1.25fr .75fr;gap:64px;}
  form{display:grid;gap:18px;}
  .row2{display:grid;grid-template-columns:1fr 1fr;gap:18px;}
  label{display:block;font-weight:600;font-size:15px;margin-bottom:6px;}
  input,select,textarea{width:100%;font:inherit;font-size:16px;padding:12px 14px;border:1px solid #b9c6cd;border-radius:6px;background:#fff;color:var(--navy);}
  textarea{min-height:140px;resize:vertical;}
  #formMsg{font-weight:600;}
  .details{border-top:3px solid var(--navy);padding-top:24px;}
  .details dt{font-weight:600;margin-top:18px;}
  .details dd{color:var(--stone);}
  .details a{color:var(--navy);text-decoration:none;font-size:1.15rem;font-weight:600;}
  .details a:hover{color:var(--blue);}

  /* ---------- Footer ---------- */
  footer{background:var(--navy);color:rgba(255,255,255,.75);padding:56px 0 40px;font-size:15px;}
  footer .wrap{display:flex;justify-content:space-between;gap:30px;flex-wrap:wrap;}
  footer a{color:#fff;text-decoration:none;}
  footer a:hover{text-decoration:underline;}
  footer nav{display:flex;gap:22px;flex-wrap:wrap;}

  .call-fab{display:flex;position:fixed;right:22px;bottom:22px;z-index:60;width:56px;height:56px;border-radius:50%;background:var(--blue);color:#fff;align-items:center;justify-content:center;box-shadow:0 6px 18px rgba(15,36,51,.3);transition:background .2s;}
  .call-fab:hover{background:var(--blue-dark);}
  .top-btn{position:fixed;right:26px;bottom:92px;z-index:60;width:48px;height:48px;border-radius:50%;background:var(--blue);color:#fff;border:0;display:flex;align-items:center;justify-content:center;cursor:pointer;box-shadow:0 4px 14px rgba(15,36,51,.25);opacity:0;visibility:hidden;transform:translateY(8px);transition:opacity .25s,transform .25s,visibility .25s,background .2s;}
  .top-btn.show{opacity:1;visibility:visible;transform:none;}
  .top-btn:hover{background:var(--blue-dark);}
  @media (max-width:560px){ .call-fab{right:16px;bottom:16px;} .top-btn{right:20px;bottom:84px;} }

  /* ---------- Mobile ---------- */
  @media (max-width:900px){
    section{padding:72px 0;}
    .svc-intro,.price-cols,.existing,.small-changes,.about-grid,.contact-grid{grid-template-columns:1fr;}
    .svc-intro{gap:28px;}
    .svc-grid{grid-template-columns:1fr 1fr;gap:30px 28px;}
    .price,.price:first-child,.price:last-child{padding:30px 0;border-right:0;border-bottom:1px solid var(--rule);}
    .about-photo{max-width:320px;}
    .menu-btn{display:block;}
    .nav-links{display:none;position:absolute;top:78px;left:0;right:0;background:#fff;flex-direction:column;align-items:flex-start;gap:0;padding:8px 28px 22px;box-shadow:0 10px 24px rgba(15,36,51,.12);}
    .nav-links.open{display:flex;}
    .nav-links li{width:100%;}
    .nav-links a{display:block;color:var(--navy);padding:14px 0;border-bottom:1px solid var(--rule);font-size:17px;}
    .nav-links .btn{margin-top:14px;text-align:center;border-bottom:0;}
    .hero{grid-template-columns:1fr;min-height:0;}
    .hero-photo{min-height:440px;padding:40px 20px 56px;}
    .hero-photo figcaption{right:12px;bottom:10px;}
    .hero-about{padding:36px 28px 44px;}
    .hero-about .who{grid-template-columns:76px 1fr;}
    .hero-about .who img{width:76px;height:76px;}
  }
  @media (max-width:560px){
    body{font-size:16.5px;}
    .wrap{padding:0 20px;}
    .row2,.svc-grid{grid-template-columns:1fr;}
    .hero-box{padding:20px 16px 18px;}
    .hero-overlay{max-width:400px;}
    .hero-about{padding:32px 20px 40px;}
    .plans th,.plans td{padding:14px 12px;}
  }
  @media (prefers-reduced-motion:reduce){ html{scroll-behavior:auto;} .work-grid img{transition:none;} }

  /* ---------- Photo header (subpages) ---------- */
  .banner{position:relative;min-height:54vh;display:flex;align-items:center;justify-content:center;padding:118px 20px 56px;margin-top:0;color:#fff;background:#2b3338 center 55%/cover no-repeat;}
  .banner::before{content:"";position:absolute;inset:0;background:rgba(15,36,51,.08);}
  .banner-inner{position:relative;display:flex;flex-direction:column;align-items:center;text-align:center;width:100%;max-width:560px;}
  .banner-box{background:rgba(15,36,51,.74);padding:26px clamp(18px,3vw,34px) 24px;width:100%;}
  .banner h1{font-size:clamp(2.1rem,3.6vw,3rem);font-weight:600;line-height:1.06;margin:0 0 10px;color:#fff;}
  .banner-box p{color:rgba(255,255,255,.9);margin:0 auto;max-width:44ch;}
  .banner .actions{justify-content:center;margin-top:18px;}
  .banner .actions .btn{border-radius:3px;}
  .banner .more{color:#fff;font-weight:600;text-decoration:underline;text-underline-offset:4px;text-shadow:0 1px 6px rgba(0,0,0,.5);}
  .banner figcaption{position:absolute;right:14px;bottom:12px;font-size:13px;background:rgba(15,36,51,.5);padding:4px 10px;border-radius:999px;}
  @media (max-width:560px){ .banner{min-height:0;padding:104px 16px 48px;} .banner-box{padding:20px 16px 18px;} }

  /* ---------- Demos ---------- */
  .demo-list{display:grid;grid-template-columns:1fr 1fr;gap:56px 44px;}
  .frame{display:block;position:relative;aspect-ratio:16/10;overflow:hidden;border:1px solid var(--rule);border-radius:6px;background:#fff;}
  .frame iframe{position:absolute;top:0;left:0;width:250%;height:250%;transform:scale(.4);transform-origin:0 0;border:0;pointer-events:none;}
  .frame:hover{border-color:var(--blue);}
  .demo-info{padding-top:18px;}
  .kind{color:var(--blue);font-weight:600;font-size:15px;}
  .demo-info h2{font-size:1.8rem;margin:2px 0 8px;}
  .demo-info p{color:var(--stone);margin-bottom:12px;}
  .view{font-weight:600;text-decoration:none;margin-right:22px;}
  .view:hover,.sub-link:hover{text-decoration:underline;}
  .sub-link{color:var(--stone);font-size:15px;}
  @media (max-width:900px){ .demo-list{grid-template-columns:1fr;gap:48px;} }

  /* ---------- Tradies page ---------- */
  .head-grid{display:grid;grid-template-columns:1.2fr .8fr;gap:56px;align-items:center;}
  .head-grid .lead{margin-bottom:28px;}
  .actions{display:flex;gap:14px;flex-wrap:wrap;}
  .phone{background:#fff;border:1px solid var(--rule);border-radius:26px;padding:18px 16px 22px;max-width:320px;justify-self:end;box-shadow:0 18px 40px rgba(15,36,51,.12);}
  .phone .bar{width:70px;height:6px;border-radius:6px;background:var(--rule);margin:0 auto 16px;}
  .phone .search{border:1px solid var(--rule);border-radius:999px;padding:9px 16px;color:var(--stone);font-size:15px;margin-bottom:14px;}
  .result{padding:12px 4px;border-top:1px solid var(--rule);}
  .result strong{display:block;font-size:16px;}
  .result span{font-size:14px;color:var(--stone);}
  .result.win strong{color:var(--blue);}
  .result.win em{float:right;font-style:normal;font-size:12px;font-weight:600;color:#fff;background:var(--blue);border-radius:4px;padding:2px 8px;}
  .result.lose{opacity:.55;}
  .phone-note{font-size:14px;color:var(--stone);margin-top:12px;text-align:center;}
  .grid2{display:grid;grid-template-columns:1fr 1fr;border-top:1px solid var(--rule);margin-top:36px;}
  .grid2 .cell{padding:28px 32px 28px 0;border-bottom:1px solid var(--rule);}
  .grid2 .cell:nth-child(even){padding:28px 0 28px 32px;border-left:1px solid var(--rule);}
  .grid3{display:grid;grid-template-columns:repeat(3,1fr);gap:40px 36px;margin-top:40px;}
  .cell p{color:var(--stone);}
  .trades{list-style:none;columns:4;column-gap:32px;margin-top:28px;}
  .trades li{padding:10px 0;border-bottom:1px solid var(--rule);break-inside:avoid;}
  .price-row{display:grid;grid-template-columns:.9fr 1.1fr;gap:48px;margin-top:36px;border-top:3px solid var(--navy);padding-top:30px;}
  .price-row .amount{font-family:var(--head);font-size:3.2rem;font-weight:700;line-height:1;}
  .price-row .amount small{font-family:var(--body);font-size:15px;font-weight:500;color:var(--stone);}
  .price-row ul{list-style:none;margin-bottom:24px;}
  .price-row li{padding:9px 0;border-bottom:1px solid var(--rule);}
  .price-row .note{color:var(--stone);margin-top:14px;}
  .faqs{display:grid;grid-template-columns:1fr 1fr;gap:34px 48px;margin-top:36px;}
  .faq p{color:var(--stone);}
  @media (max-width:900px){
    .head-grid,.grid2,.price-row,.faqs{grid-template-columns:1fr;}
    .phone{justify-self:start;}
    .grid2 .cell,.grid2 .cell:nth-child(even){padding:24px 0;border-left:0;}
    .grid3{grid-template-columns:1fr 1fr;}
    .trades{columns:2;}
  }
  @media (max-width:560px){ .grid3{grid-template-columns:1fr;} }


  /* ---------- Menu dropdown ---------- */
  .has-sub{position:relative;}
  .sub-toggle::after{content:"";display:inline-block;width:7px;height:7px;border-right:2px solid currentColor;border-bottom:2px solid currentColor;transform:rotate(45deg);margin:0 0 3px 8px;}
  .sub{display:none;position:absolute;top:100%;left:-18px;min-width:250px;list-style:none;background:#fff;border-top:3px solid var(--blue);box-shadow:0 12px 28px rgba(15,36,51,.14);padding:8px 0;}
  .has-sub:hover .sub,.has-sub:focus-within .sub{display:block;}
  .has-sub::after{content:"";position:absolute;left:0;right:0;top:100%;height:12px;}
  .sub a{display:block;padding:10px 18px;color:var(--navy) !important;}
  .sub a:hover{background:var(--mist);}
  .nav-links a[aria-current="page"]{color:var(--blue) !important;}
  .nav-links .btn[aria-current="page"]{color:#fff !important;}
  /* ---------- Home: service links ---------- */
  .home-intro{display:grid;grid-template-columns:1fr 1fr;gap:56px;margin-top:8px;}
  .home-intro p{color:var(--stone);margin-bottom:14px;}
  .home-intro p.lead{color:var(--navy);}
  .svc-links{display:grid;grid-template-columns:repeat(4,1fr);gap:28px;margin-top:44px;}
  .svc-link{display:flex;flex-direction:column;background:#fff;border:1px solid var(--rule);border-top:3px solid var(--navy);padding:24px 22px 22px;text-decoration:none;color:var(--navy);transition:border-color .2s,box-shadow .2s;}
  .svc-link:hover{border-top-color:var(--blue);box-shadow:0 10px 24px rgba(15,36,51,.08);}
  .svc-link h3{font-size:1.5rem;margin-bottom:8px;}
  .svc-link p{color:var(--stone);font-size:16px;flex:1;margin-bottom:14px;}
  .svc-link span{color:var(--blue);font-weight:600;}
  .price-strip{display:flex;gap:30px;flex-wrap:wrap;align-items:center;justify-content:space-between;border-top:3px solid var(--navy);padding-top:24px;margin-top:8px;}
  .price-strip .big{font-family:var(--head);font-size:2.2rem;font-weight:700;line-height:1;}
  .price-strip .big small{font-family:var(--body);font-size:15px;color:var(--stone);font-weight:500;}
  /* ---------- About page ---------- */
  .about-page{display:grid;grid-template-columns:320px 1fr;gap:60px;align-items:start;}
  .about-page img{width:100%;aspect-ratio:4/5;object-fit:cover;border-radius:6px;}
  .about-page .cap{margin-top:12px;font-weight:600;}
  .about-page .cap small{display:block;font-weight:400;color:var(--stone);}
  .about-page p{margin-bottom:16px;}
  .about-page p.first{font-size:1.2rem;}
  .steps{list-style:none;counter-reset:s;display:grid;grid-template-columns:repeat(4,1fr);gap:32px;margin-top:40px;}
  .steps li{counter-increment:s;border-top:2px solid var(--navy);padding-top:16px;}
  .steps li::before{content:counter(s);display:block;font-family:var(--head);font-size:2.4rem;font-weight:700;color:var(--blue);line-height:1;margin-bottom:8px;}
  .steps p{color:var(--stone);font-size:16px;}
  /* ---------- CTA band ---------- */
  .cta-band{background:var(--navy);color:#fff;padding:76px 0;}
  .cta-band h2{color:#fff;}
  .cta-band p{color:rgba(255,255,255,.82);margin-bottom:26px;}
  .cta-band .actions{display:flex;gap:20px;flex-wrap:wrap;align-items:center;}
  .cta-band .phone-link{color:#fff;font-weight:600;font-size:1.1rem;text-decoration:none;}
  .cta-band .phone-link:hover{text-decoration:underline;}
  .actions{display:flex;gap:14px;flex-wrap:wrap;}
  @media (max-width:900px){
    .sub{display:block;position:static;box-shadow:none;border:0;padding:0 0 6px 16px;min-width:0;}
    .sub a{padding:12px 0 !important;font-size:16px !important;}
    .sub-toggle::after{display:none;}
    .home-intro,.about-page{grid-template-columns:1fr;gap:28px;}
    .about-page .pic{max-width:300px;}
    .svc-links{grid-template-columns:1fr 1fr;}
    .steps{grid-template-columns:1fr 1fr;}
  }
  @media (max-width:560px){ .svc-links,.steps{grid-template-columns:1fr;} }
  /* keep grid content inside the screen on small devices */
  .hero>*,.svc-intro>*,.home-intro>*,.about-page>*,.contact-grid>*,.price-cols>*,.svc-grid>*,.svc-links>*,.head-grid>*,.price-row>*,.faqs>*{min-width:0;}
  .plans-table{max-width:100%;overflow-x:auto;-webkit-overflow-scrolling:touch;}
  .svc-pic img,.about-page img{max-width:100%;height:auto;}

  /* ---------- Plain white header (pages without a photo) ---------- */
  .banner.plain{min-height:0;background:var(--white);color:var(--navy);padding:150px 0 54px;border-bottom:1px solid var(--rule);display:block;}
  .banner.plain::before{display:none;}
  .banner.plain .banner-inner{max-width:var(--wrap);margin:0 auto;padding:0 28px;align-items:flex-start;text-align:left;}
  .banner.plain .banner-box{background:none;padding:0;}
  .banner.plain h1{color:var(--navy);font-size:clamp(2.6rem,5.4vw,4.4rem);font-weight:700;line-height:1;margin-bottom:14px;}
  .banner.plain .banner-box p{color:var(--stone);font-size:1.15rem;margin:0;max-width:52ch;}
  .banner.plain .actions{justify-content:flex-start;margin-top:24px;}
  .banner.plain .more{color:var(--blue);text-shadow:none;}
  @media (prefers-reduced-motion:no-preference){
    .banner.plain h1{animation:slideL .9s cubic-bezier(.2,.7,.2,1) both;}
    .banner.plain .banner-box p{animation:slideR .9s cubic-bezier(.2,.7,.2,1) .15s both;}
    .banner.plain .actions{animation:fadeUp .8s cubic-bezier(.2,.7,.2,1) .35s both;}
    @keyframes slideL{from{opacity:0;transform:translateX(-60px);}to{opacity:1;transform:none;}}
    @keyframes slideR{from{opacity:0;transform:translateX(60px);}to{opacity:1;transform:none;}}
    @keyframes fadeUp{from{opacity:0;transform:translateY(12px);}to{opacity:1;transform:none;}}
  }
  @media (max-width:560px){ .banner.plain{padding:118px 0 40px;} .banner.plain .banner-inner{padding:0 20px;} }

  /* photo header with the text on the left (keeps the island clear) */
  .banner.left{justify-content:flex-start;}
  .banner.left .banner-inner{margin-left:max(0px,calc((100% - var(--wrap)) / 2 + 8px));align-items:flex-start;text-align:left;max-width:520px;}
  .banner.left .banner-box p{margin:0;}
  .banner.left .actions{justify-content:flex-start;}
  @media (max-width:900px){ .banner.left{background-position:62% 80% !important;} .banner.left .banner-inner{margin-left:0;} }





/* ---------- Work page (portfolio) ---------- */
  .wk-sec{padding-top:48px;}
  .wk-filter{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:34px;}
  .wk-filter button{font-family:var(--body);font-size:16px;font-weight:500;color:var(--navy);background:none;border:0;padding:12px 22px;cursor:pointer;border-radius:3px;}
  .wk-filter button:hover{color:var(--blue);}
  .wk-filter button.on{background:var(--blue);color:#fff;}
  .wk-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:28px;}
  .wk{position:relative;display:block;text-decoration:none;color:#fff;border:1px solid var(--rule);overflow:hidden;background:#fff;}
  .wk[hidden]{display:none;}
  .wk-pic{aspect-ratio:16/10;overflow:hidden;position:relative;background:var(--mist);}
  .wk-pic img{width:100%;height:100%;object-fit:cover;object-position:50% 0;}
  .wk-pic iframe{position:absolute;top:0;left:0;width:300%;height:300%;transform:scale(.3333);transform-origin:0 0;border:0;pointer-events:none;}
  .wk-over{position:absolute;inset:0;background:rgba(15,36,51,.82);padding:28px 26px;display:flex;flex-direction:column;justify-content:center;opacity:0;transition:opacity .25s;}
  .wk:hover .wk-over,.wk:focus-visible .wk-over{opacity:1;}
  .wk-cat{font-size:13.5px;font-weight:600;letter-spacing:.06em;text-transform:uppercase;color:#9CC8FF;}
  .wk-over h2{color:#fff;font-size:1.9rem;margin:4px 0 8px;}
  .wk-over p{color:rgba(255,255,255,.9);font-size:16px;margin-bottom:18px;}
  .wk-btn{align-self:flex-start;background:#fff;color:var(--navy);font-weight:600;padding:10px 20px;border-radius:3px;font-size:15.5px;}
  @media (hover:none),(max-width:700px){
    .wk-over{position:static;opacity:1;background:#fff;color:var(--navy);padding:16px 18px 20px;justify-content:flex-start;}
    .wk-cat{color:var(--blue);}
    .wk-over h2{color:var(--navy);font-size:1.6rem;}
    .wk-over p{color:var(--stone);margin-bottom:12px;}
    .wk-btn{background:none;color:var(--blue);padding:0;}
  }
  @media (max-width:1000px){ .wk-grid{grid-template-columns:repeat(2,1fr);} }
  @media (max-width:640px){ .wk-grid{grid-template-columns:1fr;gap:22px;} .wk-filter button{padding:10px 14px;} }

  .pj-crumbs{padding:104px 0 0;border-bottom:1px solid var(--rule);font-size:15.5px;}
  .pj-crumbs .wrap{display:flex;flex-wrap:wrap;gap:8px;align-items:center;padding-bottom:16px;}
  .pj-crumbs a{color:var(--navy);text-decoration:none;}
  .pj-crumbs a:hover{color:var(--blue);}
  .pj-crumbs span{color:var(--stone);}
  .pj{padding-top:44px;}
  .pj-grid{display:grid;grid-template-columns:1.3fr 1fr;gap:48px;align-items:start;}
  .pj-pic{position:sticky;top:100px;}
  .pj-pic a{display:block;border:1px solid var(--rule);}
  .pj-pic img{width:100%;height:auto;}
  .pj-frame{position:relative;aspect-ratio:16/10;overflow:hidden;background:var(--mist);}
  .pj-frame iframe{position:absolute;top:0;left:0;width:250%;height:250%;transform:scale(.4);transform-origin:0 0;border:0;pointer-events:none;}
  .pj-text h1{font-size:clamp(2.2rem,4vw,3rem);margin:2px 0 16px;}
  .pj-text p{margin-bottom:14px;}
  .pj-h{font-size:1.45rem;margin:24px 0 8px;}
  .pj-list{padding-left:20px;margin-bottom:22px;}
  .pj-list li{padding:2px 0;}
  .pj-meta{border-top:1px solid var(--rule);margin-bottom:24px;}
  .pj-meta div{display:grid;grid-template-columns:110px 1fr;gap:12px;padding:10px 0;border-bottom:1px solid var(--rule);}
  .pj-meta dt{color:var(--stone);}
  .pj-meta a{word-break:break-all;}
  .pj-actions{display:flex;gap:14px;flex-wrap:wrap;}
  .pj-nav{border-top:1px solid var(--rule);}
  .pj-nav .wrap{display:flex;justify-content:space-between;align-items:center;gap:20px;padding-top:26px;padding-bottom:26px;}
  .pj-nav a{text-decoration:none;color:var(--navy);font-weight:600;font-family:var(--head);font-size:1.35rem;}
  .pj-nav a:hover{color:var(--blue);}
  .pj-nav small{display:block;font-family:var(--body);font-weight:400;font-size:14px;color:var(--stone);}
  .pj-nav .pj-next{text-align:right;}
  .pj-nav .pj-all{font-family:var(--body);font-size:16px;}
  @media (max-width:900px){ .pj-pic{position:static;} .pj-grid{grid-template-columns:1fr;gap:30px;} .pj-crumbs{padding-top:92px;} }
  @media (max-width:560px){ .pj-nav .pj-all{display:none;} .pj-nav a{font-size:1.15rem;} }