/* Elite Texas Movers: the load.
   A white Texas daylight page. Section names are stencilled labels (Stardos Stencil), the same
   words that are sprayed on the boxes in the 3D load. Kraft is the material, stencil ink the text,
   their flag red the one accent, blanket navy the footer. Body in Manuale. */

:root {
  --daylight: #FFFFFF;
  --kraft: #C49E70;
  --kraft-edge: #B48D5F;
  --ink: #1B1916;
  --ink-soft: #57504A;
  --red: #B42A1E;
  --red-hover: #962015;
  --navy: #15223A;
  --navy-soft: #C9D1DE;
  --rule: #E3DDD5;
  --paper: #F6F4F1;

  --f-stencil: 'Stardos Stencil', 'Rockwell', Georgia, serif;
  --f-body: 'Manuale', Georgia, 'Times New Roman', serif;

  --gut: clamp(20px, 4.4vw, 72px);
  --max: 1320px;
  --head-h: 92px;

  --grain: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='260' height='260'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2' stitchTiles='stitch'/><feColorMatrix values='0 0 0 0 .32  0 0 0 0 .22  0 0 0 0 .12  0 0 0 .20 0'/></filter><rect width='260' height='260' filter='url(%23n)'/></svg>");

  --sa-accent: #B42A1E;
  --sa-accent-ink: #FFFFFF;
}

*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; text-size-adjust: 100%; }
body {
  margin: 0;
  background: var(--daylight);
  color: var(--ink);
  font: 400 19px/1.62 var(--f-body);
  font-kerning: normal;
  font-variant-numeric: lining-nums;
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}
img { max-width: 100%; height: auto; display: block; }
a { color: var(--ink); text-decoration-thickness: 1px; text-underline-offset: 5px; }
a:hover { text-decoration-thickness: 2px; }
:focus-visible { outline: 3px solid var(--red); outline-offset: 3px; border-radius: 2px; }
p { margin: 0 0 1em; }
address { font-style: normal; }
ul, ol { margin: 0; padding: 0; }

.stencil, h1, h2 {
  font-family: var(--f-stencil);
  font-weight: 400;
  text-transform: uppercase;
  letter-spacing: .03em;
  text-shadow: 0 0 1px rgba(27, 25, 22, .28);
  text-wrap: balance;
  margin: 0;
}
h1 { font-size: clamp(50px, 7vw, 108px); line-height: .95; }
h2 { font-size: clamp(40px, 4.7vw, 74px); line-height: .98; }
h3 { font: 500 clamp(21px, 1.6vw, 25px)/1.28 var(--f-body); letter-spacing: -.005em; margin: 0; text-wrap: balance; }
.lede { font-size: clamp(20px, 1.5vw, 23px); line-height: 1.5; font-weight: 300; }
.soft { color: var(--ink-soft); }
.num { font-variant-numeric: tabular-nums lining-nums; }

.skip { position: fixed; left: 16px; top: -80px; z-index: 200; background: var(--ink); color: #fff; padding: 12px 16px; border-radius: 2px; }
.skip:focus { top: 16px; }
.sr-only { position: absolute !important; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); clip-path: inset(50%); white-space: nowrap; }

/* ------------------------------------------------------------------ buttons */
.btn {
  display: inline-flex; align-items: center; justify-content: center;
  min-height: 54px; padding: 0 26px;
  border: 0; border-radius: 2px;
  font: 500 17px/1.1 var(--f-body); letter-spacing: .012em;
  text-decoration: none; cursor: pointer; white-space: nowrap;
  transition: background-color .2s ease, transform .2s ease;
}
.btn:active { transform: translateY(1px); }
.btn--red { background: var(--red); color: #fff; }
.btn--red:hover { background: var(--red-hover); }
.btn--ink { background: var(--ink); color: #fff; }
.btn--ink:hover { background: #000; }
.btn--light { background: #fff; color: var(--ink); }
.btn--light:hover { background: var(--paper); }
.actions { display: flex; flex-wrap: wrap; align-items: center; gap: 14px 26px; margin-top: 30px; }
.tel { font: 500 19px/1 var(--f-body); color: var(--ink); text-decoration: underline; text-decoration-color: rgba(27,25,22,.35); text-underline-offset: 7px; font-variant-numeric: tabular-nums; }
.tel:hover { text-decoration-color: var(--ink); }
.more { font-weight: 500; }

/* ------------------------------------------------------------------ header */
.top {
  position: fixed; inset: 0 0 auto 0; z-index: 70;
  height: var(--head-h);
  display: flex; align-items: center; justify-content: space-between; gap: 20px;
  padding: 0 var(--gut);
  transition: background-color .35s ease, box-shadow .35s ease;
}
.top.is-solid { background: rgba(255,255,255,.96); box-shadow: 0 1px 0 var(--rule); -webkit-backdrop-filter: saturate(140%) blur(10px); backdrop-filter: saturate(140%) blur(10px); }
.brand { display: flex; align-items: center; gap: 14px; text-decoration: none; color: var(--ink); }
.brand img { width: 54px; height: auto; }
.brand span { font: 400 21px/1 var(--f-stencil); letter-spacing: .06em; text-transform: uppercase; white-space: nowrap; }
.top__actions { display: flex; align-items: center; gap: 10px; }
.top__tel { font: 500 18px/1 var(--f-body); color: var(--ink); text-decoration: none; padding: 16px 12px; font-variant-numeric: tabular-nums; }
.top__tel:hover { text-decoration: underline; }
.top .btn { min-height: 48px; padding: 0 20px; }

/* ------------------------------------------------------------------ the manifest (menu) */
.menu {
  position: fixed; inset: 0; z-index: 90;
  background: #fff;
  overflow-y: auto; overscroll-behavior: contain;
  padding: calc(var(--head-h) + 20px) var(--gut) 56px;
}
.menu[hidden] { display: none; }
.menu__close { position: fixed; top: calc((var(--head-h) - 48px) / 2); right: var(--gut); z-index: 91; min-height: 48px; }
.menu__inner { max-width: var(--max); margin: 0 auto; display: grid; grid-template-columns: minmax(0, 1.35fr) minmax(0, 1fr); gap: 56px 80px; }
.menu__h { font: 500 16px/1 var(--f-body); color: var(--ink-soft); margin: 0 0 18px; }
.menu__load { list-style: none; border-top: 2px solid var(--ink); }
.menu__load li { border-bottom: 1px solid var(--rule); }
.menu__load a { display: grid; grid-template-columns: 1fr auto; align-items: baseline; gap: 20px; padding: 14px 0; text-decoration: none; color: var(--ink); }
.menu__load .stencil { font-size: clamp(28px, 3.1vw, 44px); line-height: 1; }
.menu__load small { font: 400 17px/1.3 var(--f-body); color: var(--ink-soft); font-variant-numeric: tabular-nums; }
.menu__load a:hover .stencil, .menu__load a[aria-current="page"] .stencil { color: var(--red); }
.menu__pages { list-style: none; }
.menu__pages a { display: inline-block; padding: 7px 0; font: 400 clamp(22px, 2vw, 28px)/1.2 var(--f-body); color: var(--ink); text-decoration: none; }
.menu__pages a:hover, .menu__pages a[aria-current="page"] { text-decoration: underline; text-decoration-thickness: 2px; text-underline-offset: 7px; }
.menu__contact { margin-top: 34px; color: var(--ink-soft); line-height: 1.75; }
.menu__contact a { color: var(--ink); }
.menu .actions { margin-top: 26px; }
body.menu-open { overflow: hidden; }

/* ------------------------------------------------------------------ the load (home) */
.stage { position: fixed; inset: 0; z-index: 0; pointer-events: none; }
.stage canvas { position: absolute; inset: 0; width: 100%; height: 100%; display: block; opacity: 0; transition: opacity .8s ease; }
.world-live .stage canvas { opacity: 1; }
.stage__still { position: absolute; inset: 0; margin: 0; transition: opacity .8s ease .15s; }
.stage__still img { width: 100%; height: 100%; object-fit: cover; object-position: 62% 50%; }
.world-live .stage__still { opacity: 0; }
.stage__veil {
  position: absolute; inset: 0; opacity: var(--veil, 0);
  background: linear-gradient(90deg, rgba(255,255,255,.95) 0%, rgba(255,255,255,.88) 27%, rgba(255,255,255,.35) 41%, rgba(255,255,255,0) 52%);
}
html:not(.has-3d) .stage { display: none; }

.journey { position: relative; z-index: 1; }
.beat { position: relative; padding: 0 var(--gut); }
.beat__text { max-width: 500px; }
.beat__text h2 { margin-bottom: 22px; }
.beat__text p { margin-bottom: .8em; }
.beat__photo { display: none; }

.hero__inner { max-width: var(--max); margin: 0 auto; min-height: 100vh; display: flex; flex-direction: column; justify-content: center; padding: calc(var(--head-h) + 24px) 0 72px; }
.hero__inner > div { max-width: 520px; }
.hero h1 { margin-bottom: 26px; }
.hero__lede { max-width: 26em; }
.hero__cue { margin-top: 44px; font: 500 16px/1 var(--f-body); color: var(--ink-soft); }

.lading { list-style: none; margin: 22px 0 6px; border-top: 2px solid var(--ink); max-width: 420px; }
.lading li { display: flex; justify-content: space-between; gap: 16px; padding: 10px 0 9px; border-bottom: 1px solid var(--rule); font-size: 18px; }
.lading li span:last-child { font-weight: 500; font-variant-numeric: tabular-nums lining-nums; }
.lading--wide { max-width: none; }
.note { font-size: 17px; color: var(--ink-soft); }

/* 3D on: the beats are long, the words hold while the load happens */
.has-3d .beat { height: 150vh; }
.has-3d .beat--hero { height: 128vh; }
.has-3d .beat--last { height: 210vh; }
.has-3d .beat__sticky { position: sticky; top: 0; height: 100vh; display: flex; flex-direction: column; justify-content: center; padding: calc(var(--head-h) + 8px) 0 40px; max-width: var(--max); margin: 0 auto; }
.has-3d .beat--hero .hero__inner { position: sticky; top: 0; height: 100vh; min-height: 0; }
.has-3d .beat__text, .has-3d .hero__inner > div { transition: opacity .55s ease, transform .55s cubic-bezier(.2,.7,.2,1); }
.has-3d .beat:not(.is-live) .beat__text, .has-3d .beat--hero:not(.is-live) .hero__inner > div { opacity: 0; transform: translateY(14px); pointer-events: none; }
.has-3d .beat__photo { display: none; }

/* the manifest readout: ticks each tier as it is loaded */
.manifest { display: none; }
.has-3d .manifest {
  display: block; position: fixed; z-index: 5;
  top: calc(var(--head-h) + 22px); right: var(--gut);
  opacity: 0; transition: opacity .4s ease; pointer-events: none;
}
.has-3d .manifest.is-on { opacity: 1; pointer-events: auto; }
.manifest ol { list-style: none; background: rgba(255,255,255,.9); padding: 14px 18px 12px; box-shadow: 0 0 0 1px var(--rule); -webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px); }
.manifest a { display: flex; align-items: center; gap: 12px; min-height: 34px; font: 400 15px/1 var(--f-stencil); letter-spacing: .06em; color: var(--ink-soft); text-decoration: none; }
.manifest a::before { content: ""; flex: none; width: 15px; height: 15px; border: 1.5px solid currentColor; border-radius: 1px; }
.manifest a.is-loaded { color: var(--ink); }
.manifest a.is-loaded::before { border-color: var(--red); background: var(--red) url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'><path d='M3.4 8.4l3 3 6.2-6.8' fill='none' stroke='white' stroke-width='2.2'/></svg>") center/12px no-repeat; }
.manifest a[aria-current="true"] { color: var(--red); }
.manifest a:hover { color: var(--ink); }

/* no 3D (no JS, no WebGL, reduced motion): a calm printed page with their photographs */
html:not(.has-3d) .beat { padding-top: clamp(64px, 9vw, 120px); }
html:not(.has-3d) .beat--hero { padding-top: 0; }
html:not(.has-3d) .beat__sticky { max-width: var(--max); margin: 0 auto; display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 32px 72px; align-items: center; }
html:not(.has-3d) .beat__photo { display: block; margin: 0; }
html:not(.has-3d) .beat__photo img { width: 100%; aspect-ratio: 4 / 3; object-fit: cover; }
html:not(.has-3d) .beat__photo figcaption { margin-top: 10px; font-size: 16px; color: var(--ink-soft); }
.hero__still { display: none; }
html:not(.has-3d) .beat--hero .hero__inner { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.15fr); align-items: center; gap: 40px 56px; }
html:not(.has-3d) .hero__still { display: block; margin: 0; }
html:not(.has-3d) .hero__still img { width: 100%; height: auto; aspect-ratio: 4 / 3; object-fit: cover; object-position: 80% 45%; }
html:not(.has-3d) .hero__cue { display: none; }
html:not(.has-3d) .beat--hero .hero__inner { min-height: 0; padding-bottom: clamp(24px, 4vw, 56px); }

/* ------------------------------------------------------------------ after the journey */
.after { position: relative; z-index: 3; background: var(--daylight); }
.section { padding: clamp(84px, 10vw, 150px) var(--gut); }
.section + .section { padding-top: 0; }
.wrap { max-width: var(--max); margin: 0 auto; }
.section__head { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 470px); gap: 20px 64px; align-items: end; margin-bottom: 52px; }
.section__head p { margin: 0; }

/* the box maker's certificate: the rating, said once */
.proof { display: grid; grid-template-columns: 260px minmax(0, 1fr); gap: 40px 64px; align-items: center; margin-bottom: 56px; }
.stamp { width: 240px; height: 240px; color: var(--red); }
.stamp text { font-family: var(--f-stencil); fill: currentColor; }
.proof h2 { margin-bottom: 18px; }
.proof p { max-width: 36em; margin: 0; }
.quotes { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 44px 48px; }
.quote { margin: 0; padding-top: 22px; border-top: 2px solid var(--ink); display: flex; flex-direction: column; }
.quote blockquote { margin: 0 0 18px; font-size: 19px; line-height: 1.58; }
.quote blockquote p { margin: 0 0 .7em; }
.quote figcaption { margin-top: auto; font-size: 16px; color: var(--ink-soft); line-height: 1.5; }
.quote__name { color: var(--ink); font-weight: 500; }
.stars { color: var(--red); letter-spacing: 2px; font-size: 15px; }
.reply { margin: 14px 0 0; padding: 12px 0 0 16px; border-left: 3px solid var(--kraft); font-size: 17px; line-height: 1.5; }
.reply span { display: block; font-weight: 500; font-size: 15px; color: var(--ink-soft); margin-bottom: 2px; }
.links { display: flex; flex-wrap: wrap; gap: 14px 28px; align-items: center; margin-top: 48px; }

.photos { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); gap: 28px 24px; }
.photos figure { margin: 0; }
.photos img { width: 100%; aspect-ratio: 3 / 4; object-fit: cover; }
.photos figcaption { margin-top: 12px; font-size: 16px; line-height: 1.45; color: var(--ink-soft); }
.photos .p1 { grid-column: 1 / span 5; }
.photos .p2 { grid-column: 6 / span 4; margin-top: 120px; }
.photos .p3 { grid-column: 10 / span 3; margin-top: 40px; }
.photos .p4 { grid-column: 2 / span 3; }
.photos .p5 { grid-column: 5 / span 4; margin-top: -60px; }
.photos .p6 { grid-column: 9 / span 4; margin-top: 30px; }

.area { display: grid; grid-template-columns: minmax(0, 1.15fr) minmax(0, 1fr); gap: 48px 80px; align-items: center; }
.txmap { width: 100%; height: auto; }
.txmap .state { fill: var(--paper); stroke: var(--ink); stroke-width: 1.6; stroke-linejoin: round; }
.txmap .ring { fill: none; stroke: var(--red); stroke-width: 1.6; stroke-dasharray: 5 4; }
.txmap .dot { fill: var(--ink); }
.txmap .dot--home { fill: var(--red); }
.txmap text { font-family: var(--f-body); font-size: 15px; fill: var(--ink); }
.txmap .lbl-soft { fill: var(--ink-soft); }
.txmap .inset-frame { fill: #fff; stroke: var(--ink); stroke-width: 1.2; }
.txmap .inset-link { stroke: var(--red); stroke-width: 1.2; fill: none; }
.cities { columns: 2; column-gap: 32px; list-style: none; margin: 20px 0 26px; }
.cities li { padding: 7px 0; border-bottom: 1px solid var(--rule); break-inside: avoid; }
.facts { margin: 0; display: grid; grid-template-columns: max-content minmax(0, 1fr); gap: 10px 26px; }
.facts dt { font-weight: 500; }
.facts dd { margin: 0; }

.creds { display: flex; flex-wrap: wrap; align-items: center; gap: 22px 56px; padding: 30px 0; border-top: 1px solid var(--rule); border-bottom: 1px solid var(--rule); }
.creds img { width: 88px; height: 88px; filter: grayscale(1) contrast(1.05); }
.creds p { margin: 0; font-size: 17px; line-height: 1.45; }
.creds strong { display: block; font-weight: 500; }

/* kraft: the side of a box */
.kraft { background-color: var(--kraft); background-image: var(--grain); color: var(--ink); }
.closer { padding: clamp(84px, 10vw, 140px) var(--gut); }
.closer__inner { max-width: var(--max); margin: 0 auto; display: grid; grid-template-columns: minmax(0, 1.2fr) minmax(0, 1fr); gap: 40px 80px; align-items: center; }
.closer h2 { font-size: clamp(46px, 6vw, 96px); line-height: .95; }
.label {
  background: #fff; color: var(--ink);
  padding: 26px 28px 28px; border-radius: 2px;
  box-shadow: 0 1px 0 rgba(0,0,0,.06), 0 18px 40px -22px rgba(60, 40, 18, .55);
}
.label dl { margin: 0 0 22px; }
.label dl div { display: grid; grid-template-columns: 96px minmax(0, 1fr); gap: 14px; padding: 10px 0; border-top: 1px solid var(--rule); }
.label dl div:first-child { border-top: 2px solid var(--ink); }
.label dt { font-weight: 500; }
.label dd { margin: 0; font-variant-numeric: tabular-nums lining-nums; }
.label .actions { margin-top: 0; }
.label .btn { width: 100%; }
.label .tel { display: inline-block; margin-top: 16px; }
.label__from { display: flex; align-items: center; gap: 12px; margin-bottom: 16px; font-size: 16px; color: var(--ink-soft); }
.label__from img { width: 40px; }

/* ------------------------------------------------------------------ inner pages */
.boxend { padding: calc(var(--head-h) + 52px) var(--gut) clamp(52px, 6vw, 88px); }
.boxend__inner { max-width: var(--max); margin: 0 auto; display: grid; grid-template-columns: minmax(0, 1.25fr) minmax(0, 420px); gap: 40px 80px; align-items: end; }
.crumbs { list-style: none; display: flex; flex-wrap: wrap; gap: 6px 10px; margin: 0 0 28px; font-size: 16px; }
.crumbs li + li::before { content: "/"; margin-right: 10px; color: rgba(27,25,22,.6); }
.crumbs a { color: var(--ink); }
.crumbs [aria-current] { color: var(--ink); }
.boxend h1 { font-size: clamp(52px, 7.4vw, 118px); margin-bottom: 22px; }
.boxend .lede { max-width: 32em; margin: 0; }
.page { padding: clamp(64px, 8vw, 112px) var(--gut) 0; }
.page > * { max-width: var(--max); margin-left: auto; margin-right: auto; }
.block { margin-bottom: clamp(64px, 8vw, 112px); }
.split { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 40px 80px; align-items: start; }
.split--rev > :first-child { order: 2; }
.prose { max-width: 38em; }
.prose h2 { margin-bottom: 24px; }
.prose h3 { margin: 30px 0 10px; }
.prose ul { list-style: none; margin: 0 0 1em; }
.prose ul li { position: relative; padding: 8px 0 8px 26px; border-bottom: 1px solid var(--rule); }
.prose ul li::before { content: ""; position: absolute; left: 0; top: 19px; width: 10px; height: 10px; background: var(--kraft); }
.fig { margin: 0; }
.fig img { width: 100%; object-fit: cover; }
.fig--tall img { aspect-ratio: 3 / 4; }
.fig--wide img { aspect-ratio: 16 / 10; }
.fig figcaption { margin-top: 12px; font-size: 16px; color: var(--ink-soft); line-height: 1.45; }
.steps { list-style: none; counter-reset: s; margin: 26px 0 0; border-top: 2px solid var(--ink); }
.steps li { counter-increment: s; display: grid; grid-template-columns: 64px minmax(0, 1fr); gap: 16px; padding: 20px 0; border-bottom: 1px solid var(--rule); }
.steps li::before { content: counter(s); font: 400 36px/1 var(--f-stencil); color: #8A6536; }
.steps h3 { margin-bottom: 6px; }
.steps p { margin: 0; }
.faq { border-top: 2px solid var(--ink); }
.faq details { border-bottom: 1px solid var(--rule); }
.faq summary { cursor: pointer; list-style: none; padding: 20px 44px 20px 0; position: relative; font: 500 21px/1.35 var(--f-body); }
.faq summary::-webkit-details-marker { display: none; }
.faq summary::after { content: ""; position: absolute; right: 6px; top: 50%; width: 14px; height: 14px; margin-top: -9px; border-right: 2px solid var(--ink); border-bottom: 2px solid var(--ink); transform: rotate(45deg); transition: transform .25s ease; }
.faq details[open] summary::after { transform: rotate(-135deg); margin-top: -2px; }
.faq details > div { padding: 0 0 22px; max-width: 42em; }
.faq details > div p:last-child { margin-bottom: 0; }
.cards { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 40px 36px; }
.svc { display: flex; flex-direction: column; text-decoration: none; color: var(--ink); }
.svc img { width: 100%; aspect-ratio: 4 / 3; object-fit: cover; margin-bottom: 18px; }
.svc .stencil { font-size: clamp(30px, 2.6vw, 40px); line-height: 1; margin-bottom: 10px; }
.svc p { margin: 0 0 12px; }
.svc:hover .stencil { color: var(--red); }
.table { width: 100%; border-collapse: collapse; font-variant-numeric: tabular-nums lining-nums; }
.table caption { text-align: left; font-weight: 500; padding-bottom: 12px; }
.table th, .table td { text-align: left; padding: 13px 14px 12px 0; border-bottom: 1px solid var(--rule); vertical-align: top; }
.table thead th { border-bottom: 2px solid var(--ink); font-weight: 500; }
.table td:not(:first-child), .table th:not(:first-child) { white-space: nowrap; }
.book { list-style: none; border-top: 2px solid var(--ink); }
.book li { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.4fr) auto; gap: 16px 40px; align-items: center; padding: 26px 0; border-bottom: 1px solid var(--rule); }
.book .stencil { font-size: clamp(28px, 2.6vw, 38px); line-height: 1; }
.book p { margin: 0; }
.wall { list-style: none; display: grid; grid-template-columns: repeat(auto-fill, minmax(250px, 1fr)); gap: 0 36px; border-top: 2px solid var(--ink); }
.wall li { padding: 16px 0; border-bottom: 1px solid var(--rule); display: grid; grid-template-columns: 44px minmax(0, 1fr); gap: 4px 14px; align-items: start; }
.mono-i { grid-row: span 3; width: 44px; height: 44px; display: grid; place-items: center; background: var(--kraft); background-image: var(--grain); font: 400 20px/1 var(--f-stencil); color: var(--ink); }
.wall__name { font-weight: 500; }
.wall__meta { font-size: 16px; color: var(--ink-soft); }
.wall .reply { grid-column: 2; margin-top: 8px; }
.readmore[hidden] { display: none; }
.quote--clamp blockquote { display: -webkit-box; -webkit-line-clamp: 7; -webkit-box-orient: vertical; overflow: hidden; }
.quote--clamp.is-open blockquote { display: block; }
.readmore { align-self: flex-start; margin: -6px 0 16px; padding: 10px 0; background: none; border: 0; font: 500 17px/1 var(--f-body); color: var(--ink); text-decoration: underline; text-underline-offset: 5px; cursor: pointer; }
.map { position: relative; width: 100%; aspect-ratio: 4 / 3; background: var(--paper); }
.map iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; }
.form { display: grid; gap: 18px; }
.form label { display: grid; gap: 6px; font-weight: 500; font-size: 17px; }
.form input, .form textarea, .form select {
  font: 400 18px/1.4 var(--f-body); color: var(--ink);
  padding: 14px 14px; border: 1.5px solid #8C847A; border-radius: 2px; background: #fff; width: 100%;
}
.form input:focus-visible, .form textarea:focus-visible { outline: 3px solid var(--red); outline-offset: 1px; border-color: var(--ink); }
.form .row2 { display: grid; grid-template-columns: 1fr 1fr; gap: 18px; }
.form .hint { font-weight: 400; color: var(--ink-soft); font-size: 15px; }
.form button { justify-self: start; }
.form__msg { font-weight: 500; min-height: 1.6em; margin: 0; }
.form__msg.is-ok { color: #1E5B2E; }
.form__msg.is-err { color: var(--red); }

/* ------------------------------------------------------------------ footer */
.foot { position: relative; z-index: 3; background: var(--navy); color: #fff; padding: clamp(64px, 8vw, 104px) var(--gut) 40px; }
.foot a { color: #fff; }
.foot :focus-visible { outline-color: #fff; }
.foot__grid { max-width: var(--max); margin: 0 auto; display: grid; grid-template-columns: minmax(0, 1.25fr) repeat(4, minmax(0, 1fr)); gap: 40px 36px; }
.foot__brand img { width: 176px; margin-bottom: 18px; }
.foot__brand p { color: var(--navy-soft); font-size: 17px; line-height: 1.55; max-width: 24em; }
.foot h2 { font: 400 17px/1.2 var(--f-stencil); letter-spacing: .08em; color: var(--kraft); margin: 0 0 16px; text-shadow: none; }
.foot ul { list-style: none; }
.foot li { margin: 0 0 9px; font-size: 17px; line-height: 1.4; }
.foot li a { text-decoration: none; }
.foot li a:hover { text-decoration: underline; }
.foot address, .foot p { font-size: 17px; line-height: 1.6; color: var(--navy-soft); }
.foot address a { color: #fff; }
.foot__base { max-width: var(--max); margin: 56px auto 0; padding-top: 24px; border-top: 1px solid rgba(201, 209, 222, .25); display: flex; flex-wrap: wrap; justify-content: space-between; gap: 12px 32px; font-size: 15px; color: var(--navy-soft); }
.foot__base a { color: var(--navy-soft); }

/* ------------------------------------------------------------------ responsive */
@media (max-width: 1100px) {
  .foot__grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .foot__brand { grid-column: 1 / -1; }
  .quotes { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .cards { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 900px) {
  :root { --head-h: 76px; }
  .top__tel { display: none; }
  .brand img { width: 44px; }
  .brand span { font-size: 17px; }
  .menu__inner, .section__head, .proof, .area, .closer__inner, .boxend__inner, .split { grid-template-columns: minmax(0, 1fr); }
  .split--rev > :first-child { order: 0; }
  .proof { gap: 28px; }
  .stamp { width: 200px; height: 200px; }
  .photos { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 24px 16px; }
  .photos figure { grid-column: auto !important; margin-top: 0 !important; }
  .book li { grid-template-columns: minmax(0, 1fr); gap: 10px; }
  html:not(.has-3d) .beat__sticky, html:not(.has-3d) .beat--hero .hero__inner { grid-template-columns: minmax(0, 1fr); }
}
@media (max-width: 760px) {
  body { font-size: 18px; }
  .top .btn--red { display: none; }
  .quotes, .cards { grid-template-columns: minmax(0, 1fr); }
  .cities { columns: 1; }
  .foot__grid { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); }
  .form .row2 { grid-template-columns: minmax(0, 1fr); }
  .table { font-size: 17px; }
  .table--rates thead { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); }
  .table--rates, .table--rates tbody, .table--rates tr, .table--rates td { display: block; width: 100%; }
  .table--rates tr { padding: 12px 0; border-bottom: 1px solid var(--rule); }
  .table--rates td { border: 0; padding: 3px 0; white-space: normal !important; }
  .table--rates td:first-child { font-weight: 500; padding-bottom: 6px; }
  .table--rates td[data-label]::before { content: attr(data-label) ": "; color: var(--ink-soft); }
  .table--rates td:empty { display: none; }
  .has-3d .beat { height: 150vh; }
  .has-3d .beat--hero { height: 124vh; }
  .has-3d .beat--last { height: 190vh; }
  /* 3D on a phone: the load rides in the top half, the words rise over a white veil below it */
  .has-3d .beat__sticky, .has-3d .beat--hero .hero__inner { justify-content: flex-end; padding: 0 0 max(28px, env(safe-area-inset-bottom)); }
  .has-3d .beat__text, .has-3d .beat--hero .hero__inner > div { position: relative; }
  .has-3d .beat__text::before, .has-3d .beat--hero .hero__inner > div::before {
    content: ""; position: absolute; top: -9vh; bottom: -40px; left: calc(-1 * var(--gut)); right: calc(-1 * var(--gut)); z-index: -1;
    background: linear-gradient(180deg, rgba(255,255,255,0), rgba(255,255,255,.93) 8vh, #fff);
  }
  .has-3d .stage__veil { display: none; }
  .has-3d .manifest { display: none; }
  .has-3d .top { background: rgba(255,255,255,.96); box-shadow: 0 1px 0 var(--rule); }
  h1 { font-size: 46px; }
  .has-3d .beat h2 { font-size: 38px; margin-bottom: 14px; }
  .has-3d .lading li { padding: 7px 0 6px; font-size: 17px; }
  .has-3d .beat__text .actions { margin-top: 18px; }
  .has-3d .hero__cue { display: none; }
}
@media (max-width: 420px) {
  .brand span { font-size: 15px; letter-spacing: .04em; }
  .actions { gap: 12px 20px; }
}

.still-mode .top, .still-mode .journey, .still-mode .after, .still-mode .foot, .still-mode .manifest, .still-mode .stage__veil { visibility: hidden; }

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { transition-duration: .01ms !important; animation-duration: .01ms !important; scroll-behavior: auto !important; }
}
