/* Andrea Dussault Design — shared chrome, plus the responsive layer the
   canvas mockup never needed. Desktop rendering is unchanged: every
   structural override lives inside a max-width media query. */

:root{
  --ink:#333333;
  --cream:#F2EDE0;
  --gold:#CFA94A;
  --sand:#E5D8C0;
  --stone:#8C7D75;
  --muted:#5a5148;
  --shell:#D8CBB0;
}

.visually-hidden{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0;}

/* Keyboard users land here first; invisible until focused. This is the only
   hidden text on the site and it exists for accessibility, not for crawlers. */
.skip-link{
  position:absolute;left:-9999px;top:0;z-index:999;
  background:var(--ink);color:var(--cream);
  padding:14px 22px;font-family:'Montserrat',sans-serif;font-size:11.5px;
  letter-spacing:0.22em;text-transform:uppercase;
}
.skip-link:focus{left:0;color:var(--cream);}
main:focus{outline:none;}
:focus-visible{outline:2px solid var(--gold);outline-offset:3px;}

/* ------------------------------------------------------------------ header */
.ad-header{
  background:var(--cream);
  padding:6px max(48px,5vw);
  border-bottom:2px solid var(--gold);
  display:flex;align-items:center;justify-content:space-between;gap:32px;
  font-family:'Montserrat',sans-serif;
  position:relative;z-index:60;
}
.ad-logo{display:flex;align-items:center;flex:0 0 auto;}
.ad-logo img{height:116px;width:auto;display:block;object-fit:contain;}
.ad-nav{
  display:flex;justify-content:space-between;flex:1 1 auto;max-width:720px;gap:24px;
  font-size:11.5px;font-weight:600;letter-spacing:0.24em;text-transform:uppercase;flex-wrap:wrap;
}
.ad-nav a{color:var(--ink);}
.ad-nav a:hover{color:var(--gold);}
.ad-nav a.is-inquire{color:var(--gold);}
.ad-nav a[aria-current="page"]{color:var(--gold);}

.ad-navtoggle{
  display:none;flex-direction:column;justify-content:center;gap:5px;
  width:44px;height:44px;padding:10px;margin-right:-10px;
  background:none;border:0;cursor:pointer;
}
.ad-navtoggle span{display:block;height:1.5px;background:var(--ink);transition:transform .3s ease,opacity .3s ease;}
.ad-navtoggle[aria-expanded="true"] span:nth-child(1){transform:translateY(6.5px) rotate(45deg);}
.ad-navtoggle[aria-expanded="true"] span:nth-child(2){opacity:0;}
.ad-navtoggle[aria-expanded="true"] span:nth-child(3){transform:translateY(-6.5px) rotate(-45deg);}

/* --------------------------------------------------------------- breadcrumb */
.ad-crumb{
  background:transparent;padding:16px max(48px,5vw);
  font-family:'Montserrat',sans-serif;font-size:10.5px;font-weight:400;
  letter-spacing:0.2em;text-transform:uppercase;
  display:flex;align-items:center;gap:11px;color:var(--stone);flex-wrap:wrap;
}
.ad-crumb a{color:var(--ink);}
.ad-crumb a:hover{color:var(--gold);}
.ad-crumb .crumb-home{color:var(--stone);}
.ad-crumb .crumb-home:hover{color:var(--gold);}
.ad-crumb .crumb-sep{color:var(--gold);}
.ad-crumb .crumb-here{color:var(--ink);}

/* ------------------------------------------------------------------ footer */
.ad-footer{background:var(--ink);color:var(--cream);padding:90px 24px 48px;font-family:'Montserrat',sans-serif;}
.ad-footer-grid{max-width:1200px;margin:0 auto;display:grid;grid-template-columns:1.4fr 1fr 1.2fr;gap:64px;}
.ad-footer-col{display:flex;flex-direction:column;gap:14px;}
.ad-footer-name{font-family:'Playfair Display',serif;font-size:24px;letter-spacing:0.04em;}
.ad-footer-former{font-size:12.5px;font-style:italic;color:var(--shell);font-weight:300;}
.ad-footer-blurb{font-size:14px;font-weight:300;line-height:1.8;color:var(--shell);max-width:34ch;}
.ad-footer-contact{font-size:13.5px;font-weight:300;line-height:1.9;color:var(--shell);}
.ad-footer-contact a{color:var(--shell);}
.ad-footer-contact a:hover{color:var(--gold);}
.ad-footer-links{display:flex;flex-direction:column;gap:14px;font-size:12.5px;font-weight:300;letter-spacing:0.16em;text-transform:uppercase;}
.ad-footer-links a{color:var(--cream);}
.ad-footer-links a:hover{color:var(--gold);}
.ad-footer-adpro{margin-top:14px;}
.ad-footer-news{display:flex;flex-direction:column;gap:18px;}
.ad-footer-eyebrow{font-size:11px;letter-spacing:0.26em;text-transform:uppercase;color:var(--gold);}
.ad-footer-news p{font-size:14px;font-weight:300;line-height:1.8;color:var(--shell);margin:0;}
.ad-news-form{display:flex;gap:0;}
.ad-news-form input{
  flex:1;min-width:0;background:transparent;border:1px solid rgba(242,237,224,0.35);border-right:none;
  color:var(--cream);padding:14px 16px;font-family:'Montserrat',sans-serif;font-size:13px;font-weight:300;outline:none;
}
.ad-news-form input::placeholder{color:rgba(216,203,176,0.75);}
.ad-news-form input:focus{border-color:var(--gold);}
.ad-news-form button{
  background:var(--gold);color:var(--ink);border:none;padding:14px 24px;
  font-family:'Montserrat',sans-serif;font-size:11px;letter-spacing:0.18em;text-transform:uppercase;cursor:pointer;
  transition:background .3s ease;
}
.ad-news-form button:hover{background:#E0BE6A;}
.ad-news-confirm{font-size:12px;font-weight:400;letter-spacing:0.16em;text-transform:uppercase;color:var(--gold);margin-top:-6px;}
.ad-news-confirm[hidden]{display:none;}
.ad-footer-base{
  max-width:1200px;margin:64px auto 0;padding-top:28px;border-top:1px solid rgba(242,237,224,0.15);
  display:flex;justify-content:space-between;flex-wrap:wrap;gap:16px;font-size:12px;font-weight:300;color:var(--shell);
}
.ad-footer-legal{display:flex;gap:28px;}
.ad-footer-legal a{color:var(--shell);}
.ad-footer-legal a:hover{color:var(--gold);}

/* ------------------------------------------------------------- team modal */
.ad-modal[hidden]{display:none;}
.ad-modal{
  position:fixed;inset:0;background:rgba(51,51,51,0.55);z-index:200;
  display:flex;align-items:center;justify-content:center;padding:24px;
}
.ad-modal-panel{
  background:#C7B8A6;max-width:1140px;width:100%;max-height:88vh;overflow:auto;
  display:grid;grid-template-columns:minmax(240px,360px) minmax(0,1fr);gap:24px;position:relative;
}
.ad-modal-close{
  position:absolute;top:18px;right:22px;background:none;border:none;
  font-family:'Montserrat',sans-serif;font-size:13px;letter-spacing:0.1em;text-transform:uppercase;
  color:var(--ink);cursor:pointer;padding:6px;
}
.ad-modal-close:hover{color:var(--gold);}
.ad-modal-figure{display:flex;align-items:center;justify-content:center;padding:56px 0 56px 56px;}
.ad-modal-figure div{aspect-ratio:3/4;width:100%;overflow:hidden;}
.ad-modal-figure img{display:block;width:100%;height:100%;object-fit:cover;object-position:center;}
.ad-modal-body{padding:72px 72px 56px 32px;display:flex;flex-direction:column;gap:18px;}
.ad-modal-name{font-family:'Playfair Display',serif;font-size:28px;font-weight:500;}
.ad-modal-title{font-family:'Montserrat',sans-serif;font-size:10.5px;letter-spacing:0.24em;text-transform:uppercase;color:var(--muted);}
.ad-modal-bio{font-size:15px;font-weight:300;line-height:1.85;color:#3d3730;margin:0;white-space:pre-line;text-align:justify;}
body.ad-modal-open{overflow:hidden;}

/* ===========================================================================
   RESPONSIVE LAYER — the mockup was authored at desktop width only.
   Everything below is scoped to a max-width query, so the desktop design
   renders exactly as designed.
   =========================================================================== */

@media (max-width:1100px){
  .ad-logo img{height:92px;}
  .ad-nav{gap:18px;font-size:10.5px;letter-spacing:0.2em;}
}

@media (max-width:960px){
  .ad-header{padding:10px max(20px,4vw);gap:16px;}
  .ad-logo img{height:74px;}
  .ad-navtoggle{display:flex;}
  .ad-nav{
    position:absolute;top:100%;left:0;right:0;
    display:none;flex-direction:column;max-width:none;gap:0;
    background:var(--cream);border-bottom:2px solid var(--gold);
    box-shadow:0 14px 26px -18px rgba(0,0,0,0.55);
    padding:6px 0 14px;
  }
  .ad-nav.is-open{display:flex;}
  .ad-nav a{padding:15px max(20px,4vw);border-top:1px solid rgba(51,51,51,0.08);font-size:12px;}

  /* collapse every authored multi-column grid to a single column */
  [data-rs~="col1"]:not([data-press-grid]){
    grid-template-columns:minmax(0,1fr) !important;
    gap:40px !important;
  }
  [data-rs~="span"]{grid-column:1/-1 !important;}

  .ad-footer-grid{grid-template-columns:minmax(0,1fr);gap:48px;}
  .ad-footer{padding:64px 24px 40px;}
  .ad-footer-base{margin-top:44px;}

  .ad-modal-panel{grid-template-columns:minmax(0,1fr);gap:0;}
  .ad-modal-figure{padding:48px 40px 0;}
  .ad-modal-figure div{max-width:320px;margin:0 auto;}
  .ad-modal-body{padding:32px 40px 48px;}

  /* portrait blocks that hang outside their column on the about page */
  [data-rs~="portrait"]{width:100% !important;margin-left:0 !important;}
}

@media (max-width:760px){
  /* the instagram strip on the blog index */
  [data-rs~="ig"]{grid-template-columns:repeat(4,minmax(0,1fr)) !important;}

  /* oversized display numerals behind the core-values copy */
  [data-rs~="numeral"]{font-size:170px !important;}

  /* generous desktop section padding */
  section[data-rs~="pad"]{padding-left:24px !important;padding-right:24px !important;}
}

@media (max-width:640px){
  .ad-crumb{padding:14px max(20px,4vw);font-size:9.5px;gap:8px;}
  [data-rs~="bigtitle"]{font-size:34px !important;}
  [data-rs~="script"]{font-size:32px !important;}
  .ad-news-form{flex-direction:column;gap:12px;}
  .ad-news-form input{border-right:1px solid rgba(242,237,224,0.35);}
  .ad-footer-base{flex-direction:column;gap:14px;}
}

/* horizontal overflow guard — a mockup translated to real viewports should
   never produce a sideways scrollbar */
@media (max-width:960px){
  html,body{overflow-x:hidden;}
  img,video{max-width:100%;}
}

/* ------------------------------------------------ home page hero chrome */
.ad-mobile-only{display:none;}
.ad-form-status{
  flex:1 1 100%;margin:0;font-family:'Montserrat',sans-serif;font-size:13px;font-weight:300;
  line-height:1.7;color:#5a5148;font-style:italic;
}
.ad-form-status[hidden]{display:none;}

@media (max-width:960px){
  /* the floating transparent hero chrome has nowhere to go on a phone —
     swap it for the same header bar every other page uses */
  .ad-mobile-only{display:block;}
  .ad-home-topbar,.ad-home-header{display:none !important;}
  .ad-home-hero{
    min-height:72svh !important;
    padding-top:56px !important;
    padding-bottom:44px !important;
  }
  .ad-home-hero [data-rs~="herocopy"]{
    width:auto !important;max-width:520px !important;top:0 !important;
  }
}
