@import url("site-base.css?v=2");

/* Hide the legacy text mark until locale branding is resolved. */
.brand-mark:not(.brand-mark-fallback){opacity:0!important}
.brand-mark.brand-mark-fallback{opacity:1!important}

/* The order action is part of the collapsed mobile navigation only. */
.mobile-nav-order{display:none}

/* The old hero demo is no longer part of the public homepage. */
.story-hero-copy .hero-actions [data-open-demo="hero"]{display:none!important}

/* Do not show the legacy static hero image while the matching coloured
   fallback for the randomly selected video is being resolved. */
.hero-poster>img{opacity:0}
.hero-poster.hero-backup-ready>img{opacity:1}
.hero-poster.has-rotating-video>img{opacity:0!important}

/* Keep the expanded desktop navigation compact enough for longer locales. */
@media (min-width:981px){
  .main-nav{gap:16px;font-size:.86rem}
  .main-nav a,.header-cta{white-space:nowrap}
  .header-inner{gap:12px}
}

@media (max-width:980px){
  .main-nav .mobile-nav-order{
    display:flex;
    align-items:center;
    justify-content:center;
    min-height:44px;
    margin-top:4px;
    padding:10px 16px;
    border-radius:999px;
    background:var(--copper);
    color:#fff;
    font-weight:850;
  }
  .main-nav .mobile-nav-order:hover{
    background:var(--copper-dark);
    color:#fff;
  }

  /* Keep the summary/payment reassurance below the form on mobile. */
  .order-shell .order-summary{order:0}
}

/* On phones each guide step reads vertically: illustration first, copy below. */
@media (max-width:620px){
  .photo-guide .photo-guide-card{
    display:flex!important;
    flex-direction:column!important;
  }
  .photo-guide .photo-guide-card img{
    width:100%!important;
    height:auto!important;
    aspect-ratio:1/1.08!important;
    object-fit:cover!important;
  }
  .photo-guide .photo-guide-card figcaption{
    width:100%;
  }
}

/* Server-rendered photo guide (moved from assets/site.js). */
.photo-guide{background:linear-gradient(180deg,#fff 0%,#fbfaf8 100%)}
.photo-guide .section-head{align-items:end}
.photo-guide-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:18px;margin-top:28px}
@media (min-width:981px){
  .photo-guide .photo-guide-grid{display:grid!important;grid-template-columns:repeat(4,minmax(0,1fr))!important}
  .photo-guide .photo-guide-card{min-width:0}
}
.photo-guide-card{margin:0;background:#fff;border:1px solid rgba(50,44,39,.13);border-radius:22px;overflow:hidden;box-shadow:0 10px 30px rgba(41,35,31,.06);display:flex;flex-direction:column}
.photo-guide-card img{width:100%;aspect-ratio:1/1.08;object-fit:cover;display:block;background:#fff}
.photo-guide-card figcaption{padding:18px 18px 20px;display:grid;grid-template-columns:auto 1fr;gap:12px 14px;align-items:start}
.photo-guide-number{width:34px;height:34px;border-radius:50%;display:grid;place-items:center;background:var(--accent,#8c5d45);color:#fff;font-weight:800;font-size:.88rem}
.photo-guide-copy strong{display:block;margin:2px 0 7px;font-size:1rem}
.photo-guide-copy p{margin:0;color:var(--muted,#6c625c);font-size:.94rem;line-height:1.55}
.photo-guide-actions{display:flex;justify-content:center;margin-top:28px}
@media (max-width:980px){.photo-guide-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:620px){.photo-guide-grid{grid-template-columns:1fr;gap:14px}.photo-guide-card{display:grid;grid-template-columns:42% 1fr;align-items:stretch}.photo-guide-card img{height:100%;aspect-ratio:auto;object-fit:cover}.photo-guide-card figcaption{grid-template-columns:auto 1fr;padding:14px}.photo-guide-actions .button{width:100%;text-align:center}}

.footer-credit{white-space:nowrap}.footer-credit a{color:inherit;text-decoration:underline;text-underline-offset:2px}