﻿/* Static release shell: deliberately no runtime JavaScript, fonts, imports or API calls. */
:root { font-family: system-ui, -apple-system, 'Segoe UI', sans-serif; line-height: 1.5; }
html { scroll-behavior: smooth; }
body { margin: 0; }
.hop-skip-link { position: absolute; z-index: 100; top: -100px; left: 16px; padding: 12px 16px; background: #fffaf2; color: #382f2a; }
.hop-skip-link:focus { top: 16px; }
.hop-gateway__not-found { min-height: 100vh; padding: 12vh 0; }
.hop-gateway__not-found h1 { font: 3.5rem Georgia, serif; }.hop-gateway {
  --ink: #20312f;
  --cream: #f8f5ec;
  --gold: #dec28d;
  --muted: #65736b;
  color: var(--ink);
  background: var(--cream);
  min-height: 100vh;
}
.hop-gateway *, .hop-gateway *::before, .hop-gateway *::after { box-sizing: border-box; }
.hop-gateway a { text-decoration: none; }
.hop-gateway a:focus-visible { outline: 3px solid #d5a559; outline-offset: 5px; }
.hop-gateway__scene {
  min-height: 710px; position: relative; isolation: isolate; overflow: hidden;
  background: radial-gradient(ellipse at 75% 62%, rgba(237,183,113,.32), transparent 32%),
    linear-gradient(155deg, #102629 0%, #1a3a3d 48%, #436464 73%, #b49b79 100%);
  color: #fff8e9;
}
.hop-gateway__scene--short { min-height: 480px; }
.hop-gateway__glow {
  position: absolute; z-index: -1; width: 520px; height: 520px; right: 2%; top: 24%;
  border-radius: 50%; background: radial-gradient(circle, rgba(246,208,143,.35), rgba(246,208,143,0) 68%);
}
.hop-gateway__horizon {
  position: absolute; z-index: -1; bottom: -8%; right: -8%; width: 68%; height: 44%;
  border-radius: 50% 0 0 0; background: rgba(13,42,43,.42); transform: rotate(-7deg);
}
.hop-gateway__wave {
  position: absolute; z-index: -1; height: 24%; width: 140%; left: -15%;
  bottom: -16%; border-radius: 50% 50% 0 0; background: rgba(6,34,40,.47);
}
.hop-gateway__wave--two { bottom: -20%; left: -3%; background: rgba(4,28,34,.50); transform: rotate(5deg); }
.hop-gateway__inner, .hop-gateway__content { width: min(1200px, calc(100% - 64px)); margin: 0 auto; }
.hop-gateway__header {
  min-height: 108px; display: flex; justify-content: space-between; align-items: center;
  gap: 24px; border-bottom: 1px solid rgba(255,255,255,.19);
}
.hop-gateway__brand { display: flex; align-items: center; gap: 14px; font-size: .82rem; letter-spacing: .19em; font-weight: 750; color: #fff9ec; }
.hop-gateway__brandmark {
  display: grid; place-items: center; height: 46px; width: 46px; border: 1px solid rgba(234,206,153,.65);
  border-radius: 50%; font: italic 1.7rem Georgia,serif; color: #edd3a4;
}
.hop-gateway__nav { display: flex; align-items: center; gap: 30px; }
.hop-gateway__nav a { color: #f9f4e8; font-size: .9rem; font-weight: 550; }
.hop-gateway__nav a:hover, .hop-gateway__footer a:hover { text-decoration: underline; text-underline-offset: 5px; }
.hop-gateway__nav-portal { border: 1px solid rgba(248,239,216,.5); padding: 12px 17px; border-radius: 3px; }
.hop-gateway__hero { max-width: 840px; padding: 96px 0 106px; }
.hop-gateway__hero--short { padding: 80px 0 96px; }
.hop-gateway__eyebrow, .hop-gateway__section-label, .hop-gateway__card-number {
  font-size: .74rem; letter-spacing: .2em; font-weight: 700;
}
.hop-gateway__eyebrow { color: #edd3a4; margin: 0 0 25px; }
.hop-gateway__hero h1 { font: normal clamp(3.5rem, 7vw, 6.6rem)/1.06 Georgia,'Times New Roman',serif; letter-spacing: -.045em; margin: 0 0 30px; }
.hop-gateway__hero h1 em { color: #e9cda0; font-weight: 400; }
.hop-gateway__intro { font-size: clamp(1.06rem, 1.8vw, 1.35rem); line-height: 1.7; max-width: 690px; color: #e5e8df; margin: 0 0 34px; }
.hop-gateway__actions { display: flex; gap: 14px; flex-wrap: wrap; }
.hop-gateway__button {
  display: inline-flex; align-items: center; justify-content: space-between; gap: 34px;
  min-height: 53px; border-radius: 4px; padding: 15px 21px; font-weight: 700; font-size: .93rem;
  transition: transform .15s ease, background .15s ease;
}
.hop-gateway__button:hover { transform: translateY(-2px); }
.hop-gateway__button--primary { color: #1a332d; background: #e7ca98; }
.hop-gateway__button--primary:hover { background: #f3daad; }
.hop-gateway__button--outline { color: #fff8e9; border: 1px solid rgba(255,255,255,.48); }
.hop-gateway__button--outline:hover { background: rgba(255,255,255,.08); }
.hop-gateway__button--dark { color: #fff8e9; background: #23413e; width: fit-content; }
.hop-gateway__button--dark:hover { background: #375c53; }
.hop-gateway__small-note { font-size: .78rem; line-height: 1.55; max-width: 560px; color: #d1dad6; margin: 22px 0 0; }
.hop-gateway__paths { padding: 93px 0 108px; }
.hop-gateway__section-label { color: #9b8054; margin: 0 0 18px; }
.hop-gateway h2 { font: normal clamp(2.3rem,4vw,3.6rem)/1.16 Georgia,'Times New Roman',serif; letter-spacing: -.03em; margin: 0 0 20px; }
.hop-gateway__section-intro { color: #596a62; font-size: 1.08rem; line-height: 1.7; max-width: 640px; margin: 0 0 40px; }
.hop-gateway__cards { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 18px; }
.hop-gateway__card { border: 1px solid #d9ddd5; border-radius: 4px; padding: 36px 32px 34px; background: #fffdf7; display: flex; flex-direction: column; min-height: 315px; }
.hop-gateway__card-number { color: #94794b; }
.hop-gateway__card h3, .hop-gateway__connect-grid h3, .hop-gateway__verification h3 {
  font: normal 1.6rem/1.25 Georgia,'Times New Roman',serif; margin: 22px 0 13px;
}
.hop-gateway__card p, .hop-gateway__connect-grid p, .hop-gateway__verification p { line-height: 1.75; color: #4d5c54; margin: 0 0 25px; }
.hop-gateway__card a, .hop-gateway__verification a { margin-top: auto; color: #27544a; font-size: .91rem; font-weight: 750; }
.hop-gateway__card a:hover, .hop-gateway__verification a:hover { text-decoration: underline; }
.hop-gateway__invitation { background: #e8e9df; padding: 77px 0; }
.hop-gateway__invitation-inner { display: flex; align-items: center; justify-content: space-between; gap: 60px; }
.hop-gateway__invitation-inner > div { max-width: 700px; }
.hop-gateway__invitation p:not(.hop-gateway__section-label) { color: #55645c; line-height: 1.75; max-width: 660px; }
.hop-gateway__footer { background: #102629; color: #e4e2d6; padding: 38px 0; }
.hop-gateway__footer-inner { display: flex; justify-content: space-between; align-items: start; gap: 32px; }
.hop-gateway__footer-inner > span { letter-spacing: .17em; font-weight: 750; font-size: .8rem; white-space: nowrap; }
.hop-gateway__footer p { margin: 0; max-width: 490px; color: #c8d0ca; font-size: .84rem; line-height: 1.7; }
.hop-gateway__footer a { font-size: .83rem; color: #f0d9ad; white-space: nowrap; }
.hop-gateway__connect-content { max-width: 1040px; }
.hop-gateway__connect-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 60px; margin: 34px 0 60px; }
.hop-gateway__connect-grid h3 { margin-top: 0; }
.hop-gateway__contact-panel { background: #fffdf7; border: 1px solid #d9ddd5; padding: 34px; border-radius: 4px; }
.hop-gateway__contact-panel h3 { margin: 18px 0; }
.hop-gateway__contact-panel .hop-gateway__button { margin: 0 0 17px; }
.hop-gateway__contact-note { font-size: .82rem; }
.hop-gateway__verification { border-top: 1px solid #ccd5cb; padding: 32px 0 40px; max-width: 780px; }
.hop-gateway__verification h3 { margin: 0 0 12px; }
.hop-gateway__verification p { margin: 0 0 15px; }
.hop-gateway__back { color: #27544a; font-weight: 750; }
@media (max-width: 900px) {
  .hop-gateway__cards { grid-template-columns: 1fr; }
  .hop-gateway__card { min-height: 0; }
  .hop-gateway__invitation-inner, .hop-gateway__footer-inner { flex-direction: column; gap: 24px; }
  .hop-gateway__connect-grid { grid-template-columns: 1fr; gap: 20px; }
}
@media (max-width: 600px) {
  .hop-gateway__inner, .hop-gateway__content { width: min(100% - 36px, 1200px); }
  .hop-gateway__header { min-height: 84px; gap: 12px; }
  .hop-gateway__brand { font-size: .65rem; letter-spacing: .1em; gap: 9px; }
  .hop-gateway__brandmark { height: 36px; width: 36px; font-size: 1.4rem; }
  .hop-gateway__nav { gap: 15px; }
  .hop-gateway__nav a { font-size: .76rem; }
  .hop-gateway__nav-portal { padding: 8px; }
  .hop-gateway__scene { min-height: 0; }
  .hop-gateway__hero { padding: 85px 0 95px; }
  .hop-gateway__hero--short { padding: 75px 0; }
  .hop-gateway__hero h1 { font-size: clamp(3rem, 11.2vw, 4.2rem); }
  .hop-gateway__intro { font-size: 1.04rem; }
  .hop-gateway__actions { flex-direction: column; align-items: stretch; }
  .hop-gateway__button { width: 100%; }
  .hop-gateway__paths { padding: 68px 0; }
  .hop-gateway__card { padding: 29px 25px; }
  .hop-gateway__invitation { padding: 60px 0; }
  .hop-gateway__contact-panel { padding: 26px; }
}
@media (prefers-reduced-motion: reduce) {
  .hop-gateway__button { transition: none; }
}

/* Gateway v1 refinement: abstract family connections, not a genealogy claim. */
.hop-gateway__connections-art {
  position: absolute;
  z-index: -1;
  width: min(33vw, 440px);
  right: 2.5%;
  top: 17%;
  color: #f0d5aa;
  opacity: .48;
  pointer-events: none;
}
.hop-gateway__connections-art svg { width: 100%; height: auto; display: block; }
.hop-gateway__familyline {
  display: flex;
  align-items: center;
  gap: 12px;
  flex-wrap: wrap;
  margin-top: 44px;
  color: #e6cda3;
  font-size: .7rem;
  font-weight: 700;
  letter-spacing: .19em;
}
.hop-gateway__familyline span[aria-hidden] { opacity: .48; }
.hop-gateway__cards .hop-gateway__card {
  border-top: 3px solid #d0b686;
  box-shadow: 0 14px 30px rgba(26, 54, 46, .045);
}
.hop-gateway__cards .hop-gateway__card:nth-child(2) { border-top-color: #8aa39b; }
.hop-gateway__cards .hop-gateway__card:nth-child(3) { border-top-color: #375e58; }
.hop-gateway__prompt-heading {
  margin-bottom: 12px !important;
  font-weight: 700;
  color: #243c37 !important;
}
.hop-gateway__prompts {
  list-style: none;
  padding: 0;
  margin: 0 0 24px;
}
.hop-gateway__prompts li {
  position: relative;
  padding: 9px 0 9px 27px;
  color: #324d44;
  line-height: 1.6;
  border-bottom: 1px solid #e0e1d9;
}
.hop-gateway__prompts li::before {
  content: '';
  position: absolute;
  left: 0;
  top: 20px;
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: #bb9d66;
}
.hop-gateway__privacy-note {
  display: flex;
  gap: 21px;
  background: #edece2;
  border-left: 3px solid #a98956;
  border-radius: 3px;
  padding: 22px 28px;
  margin: 0 0 44px;
}
.hop-gateway__privacy-icon {
  color: #896f45;
  font-size: 1.5rem;
  line-height: 1.2;
}
.hop-gateway__privacy-note h3 {
  margin: 0 0 8px;
  font: normal 1.35rem/1.3 Georgia,'Times New Roman',serif;
}
.hop-gateway__privacy-note p {
  margin: 0;
  color: #526058;
  font-size: .92rem;
  line-height: 1.7;
}
@media (max-width: 900px) {
  .hop-gateway__connections-art { width: 36vw; right: -8%; top: 23%; opacity: .28; }
}
@media (max-width: 600px) {
  .hop-gateway__connections-art { width: 74vw; right: -28%; top: 21%; opacity: .22; }
  .hop-gateway__familyline { gap: 9px; letter-spacing: .12em; font-size: .66rem; margin-top: 35px; }
  .hop-gateway__privacy-note { padding: 20px 18px; gap: 12px; }
}

/* Gateway v1 warm cinematic treatment.
 * Public editorial surface only; no historical or protected imagery. */
.hop-gateway {
  --ink: #382f2a;
  --cream: #fbf5ea;
  --gold: #edcc96;
  --muted: #766b60;
  background: var(--cream);
}
.hop-gateway__scene {
  background:
    radial-gradient(ellipse at 79% 58%, rgba(253, 198, 126, .35) 0%, rgba(248, 174, 111, .11) 26%, transparent 51%),
    radial-gradient(ellipse at 100% 8%, rgba(226, 140, 110, .24), transparent 47%),
    linear-gradient(122deg, #263936 0%, #45453c 35%, #81594a 71%, #ae805d 100%);
  color: #fff8e9;
}
.hop-gateway__scene--short {
  background:
    radial-gradient(ellipse at 82% 76%, rgba(249, 193, 128, .29), transparent 53%),
    linear-gradient(126deg, #2d3b37 0%, #635044 58%, #aa795c 100%);
}
.hop-gateway__glow {
  background: radial-gradient(circle, rgba(255, 211, 152, .45), rgba(246, 188, 131, 0) 69%);
}
.hop-gateway__horizon { background: rgba(61, 48, 42, .29); }
.hop-gateway__wave { background: rgba(38, 42, 37, .43); }
.hop-gateway__wave--two { background: rgba(39, 37, 34, .38); }
.hop-gateway__connections-art { color: #f4d6ae; opacity: .37; }
.hop-gateway__hero h1 em { color: #f5d3a3; }
.hop-gateway__eyebrow, .hop-gateway__familyline { color: #f8d7ac; }
.hop-gateway__intro { color: #f4ebe1; }
.hop-gateway__small-note { color: #e5dfd1; }
.hop-gateway__button--primary { background: #f3cf93; color: #33362e; }
.hop-gateway__button--primary:hover { background: #ffe0a8; }
.hop-gateway__button--outline { border-color: rgba(255, 241, 215, .67); }
.hop-gateway__paths { background: #fbf5ea; }
.hop-gateway__section-label { color: #9f6a46; }
.hop-gateway__section-intro { color: #6b6259; }
.hop-gateway__card {
  border-color: #e4d4c2;
  background: #fffaf2;
}
.hop-gateway__cards .hop-gateway__card {
  box-shadow: 0 14px 30px rgba(67, 46, 31, .047);
}
.hop-gateway__cards .hop-gateway__card:nth-child(1) { border-top-color: #db9e72; }
.hop-gateway__cards .hop-gateway__card:nth-child(2) { border-top-color: #c9ab80; }
.hop-gateway__cards .hop-gateway__card:nth-child(3) { border-top-color: #60776c; }
.hop-gateway__card-number { color: #986f50; }
.hop-gateway__card p, .hop-gateway__connect-grid p, .hop-gateway__verification p { color: #645e55; }
.hop-gateway__card a, .hop-gateway__verification a, .hop-gateway__back { color: #6a4a39; }
.hop-gateway__invitation { background: #f3e7d7; }
.hop-gateway__invitation p:not(.hop-gateway__section-label) { color: #675d52; }
.hop-gateway__button--dark { background: #604c3e; }
.hop-gateway__button--dark:hover { background: #795a46; }
.hop-gateway__contact-panel {
  position:relative;isolation:isolate;overflow:hidden;
  background:linear-gradient(130deg,#fffaf1,#f3e9d8);
  border:1px solid #d7c4ac;
  border-top:4px solid #c99d67;
  border-radius:0 24px 0 0;
  padding:37px 35px 31px;
}
.hop-gateway__contact-panel::before {
  content:"";position:absolute;right:-56px;top:-66px;
  width:205px;height:205px;border:1px solid rgba(153,112,64,.16);
  border-radius:50%;pointer-events:none;
}
.hop-gateway__contact-panel::after {
  content:"";position:absolute;left:34px;right:34px;bottom:18px;
  border-bottom:1px solid rgba(159,118,75,.2);pointer-events:none;
}
.hop-v14-site .hop-gateway__contact-panel .hop-gateway__card-number {color:#845c37;}
@media(max-width:600px) {
  .hop-gateway__contact-panel {padding:29px 23px 34px;}
}

.hop-gateway__prompts li { color: #5c4b40; border-color: #e8d9c7; }
.hop-gateway__prompt-heading { color: #57463b !important; }
.hop-gateway__prompts li::before { background: #c18e66; }
.hop-gateway__privacy-note { background: #f4eadc; border-left-color: #ba845c; }
.hop-gateway__privacy-note p { color: #665c51; }
.hop-gateway__verification {
  position:relative;border-top:1px solid #b1c6b5;
  background:linear-gradient(90deg,rgba(227,239,227,.53),transparent 95%);
  padding:33px clamp(18px,3vw,33px) 32px;
  max-width:890px;
}
.hop-gateway__verification::before {
  content:"";position:absolute;top:-3px;left:0;
  width:73px;height:3px;background:#4a8675;
}
.hop-v14-site .hop-gateway__verification a {
  display:inline-flex;align-items:center;max-width:100%;
  margin-top:5px;padding:12px 18px;
  border:1px solid #6f9c8e;border-left:3px solid #427a6d;
  border-radius:0 13px 0 13px;
  background:rgba(225,239,230,.84);
  color:#245c52;font:650 .87rem/1.5 system-ui,sans-serif;
  text-decoration:none;
}
.hop-v14-site .hop-gateway__verification a:hover {color:#113e37;background:#d5e9dc;}
.hop-v14-site .hop-gateway__back {
  display:inline-flex;align-items:center;
  min-height:48px;margin-top:6px;padding:7px 0 8px;
  color:#704c30;text-decoration:none;
  font:600 .87rem/1.5 system-ui,sans-serif;
  border-bottom:1px solid rgba(147,110,67,.39);
}
.hop-v14-site .hop-gateway__back:hover {color:#2c675c;border-color:#2c675c;}

.hop-gateway__footer { background: #2d3834; }
@media (max-width: 600px) {
  .hop-gateway__connections-art { opacity: .18; }
  .hop-gateway__scene {
    background:
      radial-gradient(ellipse at 100% 50%, rgba(252, 192, 130, .27), transparent 61%),
      linear-gradient(132deg, #2e3a35 0%, #654d40 67%, #9b7155 100%);
  }
}



/* v1.1 cinematic public welcome and family research candidate.
   Scenic vector art is interpretive, not a historical reconstruction. */
.hop-v11 { background:#fbf6ee; }
.hop-v11 h1, .hop-v11 h2, .hop-v11 h3 { letter-spacing:-.035em; }
.hop-v11 h1 em, .hop-v11 h2 em { font-weight:400; color:#f2c992; }
.hop-v11-hero { min-height:690px; background:linear-gradient(116deg,#1e3333 0%,#30413d 47%,#584941 100%); }
.hop-v11-hero .hop-gateway__header { position:relative; z-index:3; }
.hop-v11-header .hop-gateway__nav { flex-wrap:wrap; justify-content:flex-end; column-gap:27px; row-gap:12px; }
.hop-v11-hero-grid { display:grid; grid-template-columns:minmax(0,1.06fr) minmax(0,.94fr); align-items:center; gap:45px; padding:62px 0 74px; min-height:570px; }
.hop-v11-hero-copy { position:relative; z-index:1; padding:24px 0; }
.hop-v11-hero-copy h1 { max-width:735px; font:normal clamp(3.7rem,5.3vw,6rem)/1.09 Georgia,'Times New Roman',serif; margin:0 0 27px; letter-spacing:-.051em; }
.hop-v11-lead { max-width:620px; font-size:clamp(1.16rem,1.65vw,1.36rem); line-height:1.64; color:#f7e8d8; margin:0 0 16px; }
.hop-v11-intro { max-width:620px; font-size:1rem; line-height:1.75; color:#d4dbd3; margin:0 0 32px; }
.hop-v11-cinema { align-self:stretch; position:relative; min-height:520px; margin:0; isolation:isolate; border-radius:240px 240px 4px 4px; overflow:hidden; border:1px solid rgba(248,218,176,.24); box-shadow:0 30px 80px rgba(9,20,21,.28); }
.hop-v11-cinema svg { display:block; width:100%; height:100%; min-height:500px; object-fit:cover; }
.hop-v11-cinema figcaption { position:absolute; bottom:0; left:0; right:0; padding:17px 28px 20px; color:#efe6d8; font-size:.69rem; line-height:1.5; letter-spacing:.028em; background:linear-gradient(0deg,rgba(14,29,27,.86),transparent); }
.hop-v11-hero-bottom { position:absolute; bottom:-2px; width:100%; height:22px; background:#fbf6ee; clip-path:polygon(0 52%,48% 100%,100% 46%,100% 100%,0 100%); }
.hop-v11-letter { background:#fbf6ee; padding:105px 0 95px; }
.hop-v11-letter-grid, .hop-v11-editorial-grid { display:grid; grid-template-columns:220px minmax(0,740px); gap:60px; align-items:start; }
.hop-v11-letter-label { padding-top:15px; }
.hop-v11-rule { display:block; width:76px; height:2px; background:#c9976c; margin-top:19px; }
.hop-v11-letter h2 { font:normal clamp(2.4rem,3.8vw,4rem)/1.18 Georgia,'Times New Roman',serif; margin:0 0 27px; }
.hop-v11-letter h2 em, .hop-v11-places h2 em, .hop-v11-discovery h2 em { color:#b87953; }
.hop-v11-letter p { font-size:1.07rem; color:#5e5851; line-height:1.85; margin:0 0 18px; }
.hop-v11-signature { font:italic 1.3rem Georgia,serif!important; color:#6d513d!important; margin-top:32px!important; }
.hop-v11-signature span { display:block; font:normal .75rem system-ui,sans-serif; text-transform:uppercase; letter-spacing:.15em; padding-top:9px; color:#928779; }
/* H1 homepage sections 2-4: distinct environmental moods and contemporary, non-cultural linework.
   No ancestry map, recorded voyage, historic artifact or sacred/cultural motif implied. */
.hop-v11-places {
  position:relative; isolation:isolate; overflow:hidden;
  padding:82px 0 90px;
  background:radial-gradient(ellipse at 100% 0,rgba(255,250,235,.88),transparent 50%),
    linear-gradient(155deg,#f0e3d2 0%,#f8eee1 58%,#eaddca 100%);
}

.hop-v11-places .hop-gateway__content {position:relative;z-index:1;}
.hop-v11-places h2 {
  font:normal clamp(2.55rem,4.1vw,4.25rem)/1.12 Georgia,serif;
  max-width:840px; margin:0 0 23px; letter-spacing:-.043em;
}
.hop-v11-places .hop-gateway__section-intro { max-width:825px; color:#544f47; }
/* Three research folios, not boxed feature cards. The owner-supplied,
   interpretive botanical corner is decorative rather than genealogical proof. */
.hop-v11-places-grid {
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:0;
  margin:42px 0 30px;
}
.hop-v11-places-grid article {
  --folio-accent:#a77b51;
  position:relative;
  isolation:isolate;
  overflow:hidden;
  display:flex;
  flex-direction:column;
  align-items:flex-start;
  min-height:280px;
  padding:40px clamp(25px,2.5vw,41px) 39px;
  border:0;
  border-radius:0;
  background:linear-gradient(180deg,rgba(255,253,247,.36),rgba(255,252,245,0) 90%);
  box-shadow:none;
}
.hop-v11-places-grid article::after {
  content:"";
  position:absolute;
  top:0;right:0;
  width:225px;height:204px;
  background:url('/assets/hop-research-folio-corner.webp') right top / contain no-repeat;
  filter:brightness(0) invert(1);
  opacity:.95;
  transform:scaleX(-1);
  transform-origin:center;
  pointer-events:none;
  z-index:0;
}
.hop-v11-places-grid article > * {position:relative;z-index:1;}
.hop-v11-places-grid article:nth-child(2) {--folio-accent:#527d73;}
.hop-v11-places-grid article:nth-child(3) {--folio-accent:#7a8a65;}
.hop-v11-places-grid article:nth-child(2)::after {opacity:.85;}
.hop-v11-places-grid article:nth-child(3)::after {opacity:.9;}
.hop-v11-places-grid article>span,
.hop-v11-research-grid article>span,.hop-v11-step {
  font-size:.72rem;letter-spacing:.18em;font-weight:750;color:#8c6948;
}
.hop-v11-places-grid article>span {
  margin:0;
  color:var(--folio-accent);
}
.hop-v11-places-grid h3,.hop-v11-next h3,.hop-v11-research-grid h3 {
  font:normal clamp(1.44rem,1.8vw,1.72rem)/1.24 Georgia,serif;
  margin:25px 0 15px;
}
.hop-v11-places-grid h3 {max-width:26ch;color:#302c29;}
.hop-v11-places-grid p,.hop-v11-next p,.hop-v11-research-grid p {
  color:#554e46;line-height:1.72;margin:0;
}
.hop-v11-places-grid p {max-width:38ch;}
@media(max-width:960px) {
  .hop-v11-places-grid {
    grid-template-columns:1fr;
    margin:30px 0 26px;
  }
  .hop-v11-places-grid article {
    min-height:0;
    padding:32px 26px 34px;
  }
  .hop-v11-places-grid article::after {width:190px;height:171px;right:0;top:0;opacity:.9;}
  .hop-v11-places-grid article:nth-child(2)::after {opacity:.8;}
  .hop-v11-places-grid article:nth-child(3)::after {opacity:.85;}
  .hop-v11-places-grid h3 {margin:19px 0 12px;}
}
/* House of Pereira action language: editorial threads, invitations and protected thresholds.
   No generic site-wide button reset. H1 accepted navbar/hero/intro remain untouched. */
.hop-v14-site {
  --hop-thread-copper:#8f583b;
  --hop-thread-ink:#322f2a;
  --hop-threshold:#275b52;
  --hop-outline:rgba(137,102,63,.36);
}
.hop-v14-site .hop-v11-text-link {
  position:relative;
  display:inline-flex;align-items:center;justify-content:space-between;
  gap:clamp(18px,3vw,38px);max-width:100%;
  min-height:53px;padding:8px 0 11px;
  margin:17px 0 10px;
  color:#653e2c!important;
  font:650 clamp(.89rem,1vw,.98rem)/1.52 system-ui,sans-serif;
  text-decoration:none!important;
  border-bottom:1px solid rgba(136,86,59,.37);
  transition:color .2s ease,border-color .2s ease;
}
.hop-v14-site .hop-v11-text-link::before {
  content:"";height:2px;width:46px;position:absolute;bottom:-1px;left:0;
  background:#b78354;
}
.hop-v14-site .hop-v11-text-link span[aria-hidden] {
  display:grid;place-items:center;flex:0 0 40px;
  width:40px;height:40px;border:1px solid rgba(130,85,50,.41);
  border-radius:50%;color:#865232;font-size:1.16rem;
  transition:transform .2s ease,background .2s ease;
}
.hop-v14-site .hop-v11-text-link:hover,
.hop-v14-site .hop-v11-text-link:focus-visible {color:#2b5c53!important;border-color:#35695c;}
.hop-v14-site .hop-v11-text-link:hover span[aria-hidden],
.hop-v14-site .hop-v11-text-link:focus-visible span[aria-hidden] {transform:translate(3px,-2px);background:#f1e5d2;}
/* Narrative invitation, research doorway and public community visit share a handmade silhouette.
   Tone differences signal purpose while geometry and arrow treatment remain consistent. */
.hop-v14-site .hop-v11-closing .hop-gateway__button,
.hop-v14-site .hop-v11-discovery .hop-gateway__button,
.hop-v14-site .hop-gateway__contact-panel .hop-gateway__button {
  display:inline-flex;align-items:center;justify-content:space-between;
  gap:clamp(14px,3vw,36px);
  min-height:58px;width:fit-content;max-width:100%;
  padding:9px 10px 9px 23px;
  border:1px solid #c39961;border-left-width:3px;
  border-radius:2px 16px 2px 16px;
  background:linear-gradient(112deg,#f6dfb3,#e9bc76);
  color:#183d38;
  font:700 .89rem/1.4 system-ui,sans-serif;
  text-decoration:none;
  box-shadow:inset 0 1px rgba(255,255,255,.63),0 9px 22px rgba(28,39,31,.13);
  transition:transform .17s ease,box-shadow .17s ease,background .17s ease;
}
.hop-v14-site .hop-v11-closing .hop-gateway__button > span[aria-hidden],
.hop-v14-site .hop-v11-discovery .hop-gateway__button > span[aria-hidden],
.hop-v14-site .hop-gateway__contact-panel .hop-gateway__button > span[aria-hidden] {
  display:grid;place-items:center;flex:0 0 38px;
  height:38px;width:38px;
  border:1px solid rgba(46,64,51,.32);
  border-radius:50%;font-size:1.15rem;line-height:1;
  transition:transform .17s ease;
}
.hop-v14-site .hop-v11-closing .hop-gateway__button:hover,
.hop-v14-site .hop-v11-discovery .hop-gateway__button:hover,
.hop-v14-site .hop-gateway__contact-panel .hop-gateway__button:hover {
  transform:translateY(-2px);
  box-shadow:inset 0 1px rgba(255,255,255,.7),0 14px 26px rgba(28,39,31,.2);
}
.hop-v14-site .hop-v11-closing .hop-gateway__button:hover > span[aria-hidden],
.hop-v14-site .hop-v11-discovery .hop-gateway__button:hover > span[aria-hidden],
.hop-v14-site .hop-gateway__contact-panel .hop-gateway__button:hover > span[aria-hidden] {transform:translate(2px,-1px);}
.hop-v14-site .hop-v11-discovery .hop-gateway__button {
  color:#fff9ed;background:linear-gradient(112deg,#245852,#113e3c);
  border-color:#78aca0;box-shadow:inset 0 1px rgba(232,255,240,.18),0 9px 22px rgba(28,39,31,.11);
}
.hop-v14-site .hop-v11-discovery .hop-gateway__button > span[aria-hidden] {border-color:rgba(237,240,213,.44);}
.hop-v14-site .hop-v11-discovery .hop-gateway__button:hover {background:linear-gradient(112deg,#306961,#184c46);}
.hop-v14-site .hop-gateway__contact-panel .hop-gateway__button {
  color:#fff8e6;background:linear-gradient(112deg,#966744,#65472f);border-color:#bd9568;
}
.hop-v14-site .hop-gateway__contact-panel .hop-gateway__button > span[aria-hidden] {border-color:rgba(249,230,199,.52);}
.hop-v14-site .hop-gateway__contact-panel .hop-gateway__button:hover {background:linear-gradient(112deg,#a77951,#75523a);}
@media(max-width:600px) {
  .hop-v14-site .hop-v11-closing .hop-gateway__button,
  .hop-v14-site .hop-v11-discovery .hop-gateway__button,
  .hop-v14-site .hop-gateway__contact-panel .hop-gateway__button {width:100%;font-size:.83rem;padding-left:16px;}
}
@media(prefers-reduced-motion:reduce) {
  .hop-v14-site .hop-v11-text-link,
  .hop-v14-site .hop-v11-text-link span[aria-hidden],
  .hop-v14-site .hop-v11-closing .hop-gateway__button,
  .hop-v14-site .hop-v11-discovery .hop-gateway__button,
  .hop-v14-site .hop-gateway__contact-panel .hop-gateway__button,
  .hop-v14-site .hop-v11-closing .hop-gateway__button > span[aria-hidden],
  .hop-v14-site .hop-v11-discovery .hop-gateway__button > span[aria-hidden],
  .hop-v14-site .hop-gateway__contact-panel .hop-gateway__button > span[aria-hidden] {transition:none;}
}

.hop-v11-discovery {
  position:relative;isolation:isolate;overflow:hidden;
  background:linear-gradient(120deg,#e8f0e8 0%,#f5f5ed 51%,#fdf8ee 100%);
  border-top:1px solid #e3e4d8;
  padding:101px 0 108px;
}
.hop-v11-discovery::before {
  content:"";position:absolute;inset:0 auto 0 0;width:26%;pointer-events:none;
  background:radial-gradient(ellipse at 0 85%,rgba(111,159,145,.15),transparent 66%);
}
.hop-v11-discovery-grid {
  position:relative;z-index:1;
  display:grid;grid-template-columns:minmax(0,.95fr) minmax(0,1.05fr);
  align-items:center;gap:clamp(36px,6vw,105px);
}
.hop-v11-discovery h2,.hop-v11-next h2 {
  font:normal clamp(2.52rem,3.9vw,4.2rem)/1.15 Georgia,serif;margin:0 0 23px;
}
.hop-v11-discovery h2 {max-width:670px;}
.hop-v11-discovery p:not(.hop-gateway__section-label) {line-height:1.85;color:#48534b;max-width:680px;}
.hop-v11-discovery .hop-gateway__button {
  margin-top:19px;border-radius:20px;min-height:50px;
  background:#214b48;color:#fffaf0;
}
.hop-v11-discovery .hop-gateway__button:hover {background:#32645e;}
.hop-v14-discovery-badge {
  width:min(100%,470px);
  margin:0;
  justify-self:center;
  text-align:center;
}
.hop-v14-discovery-badge img {
  display:block;
  width:100%;
  height:auto;
  aspect-ratio:1;
  object-fit:contain;
  filter:drop-shadow(0 13px 19px rgba(30,62,53,.14));
}
.hop-v14-discovery-badge figcaption {
  margin:9px 0 0;
  color:#546d61;
  font:500 .72rem/1.5 system-ui,sans-serif;
  letter-spacing:.025em;
}
.hop-v14-discovery-badge figcaption a {
  color:#265d53;
  font-weight:650;
  text-decoration:underline;
  text-underline-offset:3px;
  white-space:nowrap;
}
.hop-v11-next {
  position:relative;isolation:isolate;overflow:hidden;
  padding:93px 0 95px;
  background:radial-gradient(ellipse at 90% 0,rgba(209,157,98,.17),transparent 56%),
    linear-gradient(130deg,#173a38 0%,#1c4642 54%,#143331 100%);
  color:#f7f0e3;
}
.hop-v11-next::before,
.hop-v11-next::after {
  content:"";position:absolute;
  left:50%;bottom:18px;
  width:min(78vw,820px);aspect-ratio:1200/89;
  -webkit-mask:url('/assets/hop-floral-divider-emboss.webp') center / contain no-repeat;
  mask:url('/assets/hop-floral-divider-emboss.webp') center / contain no-repeat;
  transform:translateX(-50%);pointer-events:none;
}
.hop-v11-next::before {background:rgba(4,33,29,.4);}
.hop-v11-next::after {
  left:calc(50% + 1px);bottom:19px;
  background:rgba(144,190,160,.28);
}
.hop-v11-next > .hop-gateway__content {position:relative;z-index:1;}
.hop-v11-next .hop-gateway__section-label {color:#d8b782;}
.hop-v11-next h2 {color:#fff7e8;max-width:860px;}
.hop-v11-next-grid {
  display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:22px;margin-top:37px;
}
.hop-v11-next-grid article {
  position:relative;isolation:isolate;overflow:hidden;
  display:flex;flex-direction:column;align-items:flex-start;
  min-height:288px; padding:34px 39px 34px;
  background:#f9f0e1;color:#332e28;border:1px solid #e7d6b9;border-top:4px solid #d6a35f;
  box-shadow:0 18px 40px rgba(3,20,18,.13);
}
.hop-v11-next-grid article:nth-child(2) {
  background:#eff5f0;border:1px solid #c4d8ce;border-top:4px solid #6c9d8c;
}
.hop-v14-way-symbol {
  position:absolute;right:31px;top:26px;
  display:grid;place-items:center;width:65px;height:65px;
  border-radius:50%;background:rgba(201,151,81,.12);
  color:#977044;border:1px solid rgba(183,133,67,.22);
}
.hop-v14-way-symbol svg {display:block;width:37px;height:37px;}
.hop-v11-next-grid article:nth-child(2) .hop-v14-way-symbol {
  background:rgba(99,145,128,.12);color:#487c6c;border-color:rgba(99,145,128,.22);
}
.hop-v11-next-grid article .hop-v11-step {
  display:block;max-width:calc(100% - 90px);margin:0 0 7px;letter-spacing:.19em;
}
.hop-v11-next-grid h3 {max-width:calc(100% - 75px);font-size:clamp(1.6rem,2vw,1.95rem);margin:13px 0 18px;}
.hop-v11-next-grid article p {max-width:520px;line-height:1.76;}
.hop-v14-site .hop-v11-next-grid article a {
  position:relative;
  display:inline-flex;align-items:center;min-height:50px;
  margin-top:auto;padding:15px 48px 6px 0;
  color:#654326;max-width:100%;
  font:700 .9rem/1.45 system-ui,sans-serif;
  text-decoration:none;
  border-bottom:1px solid #bd9568;
  transition:color .2s ease,border-color .2s ease;
}
.hop-v14-site .hop-v11-next-grid article a::after {
  content:"↗";position:absolute;right:1px;bottom:10px;
  display:grid;place-items:center;
  width:29px;height:29px;border:1px solid #a78354;
  border-radius:50%;pointer-events:none;
  font-size:1.08rem;line-height:1;color:#815832;
}
.hop-v14-site .hop-v11-next-grid article:first-child a span[aria-hidden] {display:none;}
.hop-v14-site .hop-v11-next-grid article a:hover {color:#174b43;border-color:#477f73;}
.hop-v14-site .hop-v11-next-grid article:nth-child(2) a {
  padding:13px 17px 13px 18px;
  margin-top:auto;
  color:#14554c;
  background:rgba(223,236,229,.64);
  border:1px solid #639084;border-left:3px solid #366c61;
  border-radius:0 13px 0 13px;
  box-shadow:inset 0 0 0 4px rgba(250,255,248,.48);
}
.hop-v14-site .hop-v11-next-grid article:nth-child(2) a::after {display:none;}
.hop-v14-site .hop-v11-next-grid article:nth-child(2) a span[aria-hidden],
.hop-v14-site .hop-gateway__verification a span[aria-hidden] {
  display:inline-block;margin-left:11px;padding-left:11px;
  border-left:1px solid rgba(38,101,85,.35);line-height:1.25;
}
.hop-v14-site .hop-v11-next-grid article:nth-child(2) a:hover {background:#d4e8de;color:#0c4039;}

@media (max-width:900px) {
  .hop-v11-discovery-grid {grid-template-columns:1fr;gap:42px;}
  .hop-v14-discovery-badge {max-width:380px;justify-self:center;}
}
@media (max-width:760px) {
  .hop-v11-places-grid,.hop-v11-next-grid {grid-template-columns:1fr;}
  .hop-v11-places-grid article {min-height:0;}
  .hop-v11-next-grid article {min-height:0;gap:0;}
  .hop-v11-places,.hop-v11-discovery,.hop-v11-next {padding:68px 0 76px;}
}
@media (max-width:420px) {
  .hop-v11-places-grid article,.hop-v11-next-grid article {padding:27px;}
  .hop-v11-next-grid h3 {max-width:100%;padding-right:50px;}
  .hop-v14-way-symbol {width:48px;height:48px;top:24px;right:23px;}
  .hop-v14-way-symbol svg {width:29px;height:29px;}
  .hop-v11-places h2,.hop-v11-next h2,.hop-v11-discovery h2 {font-size:clamp(2.3rem,11vw,3rem);}
}
.hop-v11-footer .hop-gateway__footer-inner { align-items:center; }
.hop-v11-footer nav { display:flex; gap:17px; flex-wrap:wrap; }
.hop-v11-footer nav a { color:#f0d9ad; font-size:.86rem; }
.hop-v11-page-hero { background:radial-gradient(ellipse at 85% 83%,rgba(226,154,101,.4),transparent 42%),linear-gradient(115deg,#203635,#625045 100%); color:#fff8e9; }
.hop-v11-page-heading { padding:80px 0 102px; max-width:880px; }
.hop-v11-page-heading h1 { font:normal clamp(3.5rem,6vw,5.4rem)/1.12 Georgia,serif; margin:0 0 25px; }
.hop-v11-page-heading p:not(.hop-gateway__eyebrow) { font-size:1.2rem; line-height:1.76; color:#eee3d5; max-width:750px; }
.hop-v11-editorial > .hop-v11-editorial-grid { padding-top:94px; padding-bottom:100px; }
.hop-v11-editorial-paper { background:#f0e5d6; padding:90px 0; }
.hop-v11-editorial-paper > .hop-v11-editorial-grid { padding:0; }
.hop-v11-prose h2 { font:normal clamp(2.5rem,3.6vw,3.65rem)/1.17 Georgia,serif; margin:0 0 24px; }
.hop-v11-prose h3 { font:normal 1.7rem Georgia,serif; margin:28px 0 16px; }
.hop-v11-prose p { font-size:1.06rem; line-height:1.85; color:#5b544b; margin:0 0 21px; }
.hop-v11-prose a {color:#704b38;}
.hop-v14-site .hop-v11-prose p a[href^="https://"] {
  color:#24655b;
  font-weight:650;text-decoration:underline;
  text-decoration-color:rgba(53,114,103,.55);
  text-underline-offset:4px;text-decoration-thickness:1px;
  box-decoration-break:clone;
}
.hop-v14-site .hop-v11-prose p a[href^="https://"]:hover {color:#964d34;text-decoration-color:#964d34;}

.hop-v11-research-grid {
  display:grid;grid-template-columns:repeat(2,minmax(0,1fr));
  gap:0 37px;margin-top:40px;
  border-top:1px solid rgba(141,103,68,.27);
}
.hop-v11-research-grid article {
  /* Names: warm copper. Each clue follows its own colour within the family palette. */
  --clue-flower-highlight:#cb9c7a;
  --clue-flower-shade:#916044;
  position:relative;isolation:isolate;min-width:0;
  display:grid;
  grid-template-columns:clamp(84px,8vw,104px) minmax(0,1fr);
  grid-template-areas:"motif label" "motif heading" "copy copy";
  grid-template-rows:25px minmax(100px,auto) auto;
  column-gap:16px;align-content:start;
  background:transparent;
  padding:51px 25px 38px 27px;
  border-top:none;border-bottom:1px solid rgba(141,103,68,.24);
  border-left:1px solid rgba(159,115,73,.32);
}
.hop-v11-research-grid article::before {
  content:"";position:absolute;top:31px;left:-5px;
  width:9px;height:9px;border:1px solid #9d7952;
  transform:rotate(45deg);background:#fff8ed;
}
.hop-v11-research-grid article::after {
  content:"";position:absolute;top:0;left:0;
  width:196px;height:181px;
  background:linear-gradient(140deg,var(--clue-flower-highlight),var(--clue-flower-shade));
  -webkit-mask:url('/assets/hop-research-five-petal-flower.webp') left top / contain no-repeat;
  mask:url('/assets/hop-research-five-petal-flower.webp') left top / contain no-repeat;
  opacity:.44;pointer-events:none;z-index:0;
}
.hop-v11-research-grid article > span {grid-area:label;position:relative;z-index:1;align-self:start;}
.hop-v11-research-grid article > h3 {grid-area:heading;position:relative;z-index:1;align-self:start;}
.hop-v11-research-grid article > p {grid-area:copy;position:relative;z-index:1;padding-top:12px;}
.hop-v11-research-grid article:nth-child(2),
.hop-v11-research-grid article:nth-child(4) {border-left-color:#739c91;}
/* Places: lagoon teal; Sources: weathered heritage gold; People: living island green. */
.hop-v11-research-grid article:nth-child(2) {--clue-flower-highlight:#8db6ae;--clue-flower-shade:#3e766e;}
.hop-v11-research-grid article:nth-child(3) {--clue-flower-highlight:#d8bd86;--clue-flower-shade:#a17e49;}
.hop-v11-research-grid article:nth-child(4) {--clue-flower-highlight:#a5ba8f;--clue-flower-shade:#678569;}
.hop-v11-research-grid article:nth-child(2)::before,
.hop-v11-research-grid article:nth-child(4)::before {border-color:#4a877d;}
.hop-v11-research-grid article>span {
  display:block;letter-spacing:.19em;color:#8f6a47;margin-bottom:10px;
}
.hop-v11-research-grid article:nth-child(even)>span {color:#39786c;}
.hop-v11-research-grid article h3 {max-width:540px;margin:0;}
.hop-v11-research-grid article p {max-width:560px;}
@media(max-width:960px) {
  .hop-v11-research-grid {grid-template-columns:1fr;gap:0;}
  .hop-v11-research-grid article {
    grid-template-columns:clamp(73px,21vw,92px) minmax(0,1fr);
    grid-template-rows:25px minmax(75px,auto) auto;column-gap:12px;
    padding:48px 13px 30px 26px;
  }
  .hop-v11-research-grid article::after {
    width:clamp(125px,39vw,150px);height:clamp(115px,36vw,138px);
    opacity:.48;
  }
}

.hop-v11-closing {
  position:relative;isolation:isolate;overflow:hidden;
  padding:92px 0 105px;
  background:radial-gradient(ellipse at 95% 0,rgba(218,160,84,.16),transparent 52%),
    linear-gradient(119deg,#102f30,#26534a 72%,#26453c);
  color:#fff9ec;
}
.hop-v14-about .hop-v11-closing::before,
.hop-v14-about .hop-v11-closing::after,
.hop-v14-research .hop-v11-closing::before,
.hop-v14-research .hop-v11-closing::after {
  content:"";position:absolute;
  right:16px;bottom:0;
  width:clamp(210px,27vw,350px);aspect-ratio:560/554;
  -webkit-mask:url('/assets/hop-family-research-corner.webp') center / contain no-repeat;
  mask:url('/assets/hop-family-research-corner.webp') center / contain no-repeat;
  transform:rotate(180deg);pointer-events:none;
}
.hop-v14-about .hop-v11-closing::before,
.hop-v14-research .hop-v11-closing::before {background:rgba(4,33,28,.3);}
.hop-v14-about .hop-v11-closing::after,
.hop-v14-research .hop-v11-closing::after {
  right:18px;bottom:2px;
  background:rgba(144,190,160,.25);
}
.hop-v11-closing-inner {position:relative;z-index:1;max-width:950px;}

.hop-v11-closing h2 { font:normal clamp(2.6rem,4vw,4.1rem)/1.15 Georgia,serif; margin:0 0 18px; }
.hop-v11-closing p:not(.hop-gateway__section-label) { max-width:670px; line-height:1.75; font-size:1.08rem; color:#f3e8dc; }
.hop-v11-closing .hop-gateway__button { margin-top:15px; }
@media (max-width: 1020px) {
 .hop-v11-hero-grid { grid-template-columns:1fr .87fr; gap:22px; }
 .hop-v11-hero-copy h1 { font-size:clamp(3.4rem,5.8vw,5.2rem); }
 .hop-v11-cinema { min-height:480px; }
 .hop-v11-letter-grid,.hop-v11-editorial-grid { grid-template-columns:160px minmax(0,1fr); gap:32px; }
 .hop-v11-discovery-grid { gap:35px; }
}
@media (max-width: 760px) {
 .hop-v11-header { flex-wrap:wrap; padding:20px 0; }
 .hop-v11-header .hop-gateway__nav { width:100%; justify-content:flex-start; gap:15px; }
 .hop-v11-header .hop-gateway__nav a { font-size:.81rem; }
 .hop-v11-hero-grid { grid-template-columns:1fr; padding:35px 0 75px; }
 .hop-v11-hero-copy { padding:13px 0; }
 .hop-v11-cinema { min-height:360px; max-height:440px; border-radius:190px 190px 4px 4px; }
 .hop-v11-cinema svg { min-height:420px; }
 .hop-v11-letter-grid,.hop-v11-editorial-grid { grid-template-columns:1fr; gap:15px; }
 .hop-v11-letter { padding:70px 0; }
 .hop-v11-places-grid { grid-template-columns:1fr; }
 .hop-v11-discovery-grid { grid-template-columns:1fr; }
 .hop-v11-discovery-art { max-width:270px; margin:0 auto; }
 .hop-v11-next-grid,.hop-v11-research-grid { grid-template-columns:1fr; }
 .hop-v11-next-grid article { padding:32px; }
 .hop-v11-page-heading { padding:55px 0 74px; }
}
@media (max-width: 420px) {
 .hop-v11-header .hop-gateway__nav { gap:11px 16px; }
 .hop-v11-header .hop-gateway__nav a { font-size:.77rem; }
 .hop-v11-hero-copy h1 { font-size:clamp(2.9rem,12vw,3.7rem); }
 .hop-v11-page-heading h1 { font-size:clamp(2.9rem,11vw,3.5rem); }
 .hop-v11-cinema { min-height:320px; }
 .hop-v11-cinema figcaption { font-size:.64rem; padding:16px; }
 .hop-v11-places,.hop-v11-discovery,.hop-v11-next { padding:67px 0; }
 .hop-v11-places-grid article { padding:27px; }
}

/* v1.2 cinematic homepage benchmark: original panoramic art, no cropping.
   The banner includes branded lettering, so no second text overlay is placed on it.
   This benchmark deliberately does not change other v1.1 page layouts. */
.hop-v12-navband {
  background: #173435;
  border-bottom: 1px solid rgba(241,207,158,.22);
}
.hop-v12-nav {
  min-height: 88px;
  display: flex;
  gap: 25px;
  align-items: center;
  justify-content: space-between;
}
.hop-v12-links {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: 15px 28px;
}
.hop-v12-links a {
  color: #fbf4e7;
  font-size: .9rem;
}
.hop-v12-navband .hop-gateway__brand { flex-shrink: 0; }
.hop-v12-stage {
  width: 100%;
  background: #172f30;
}
.hop-v12-scene { margin: 0; }
.hop-v12-scene img {
  display: block;
  width: 100%;
  height: auto;
  max-width: 100%;
  aspect-ratio: 1956 / 804;
  object-fit: contain;
}
.hop-v12-scene figcaption {
  padding: 12px 20px 13px;
  margin: 0;
  text-align: center;
  font-size: .78rem;
  line-height: 1.6;
  color: #ece2d1;
  background: #203738;
}
.hop-v12-intro {
  background: radial-gradient(ellipse at 84% 10%,rgba(233,163,103,.18),transparent 48%),#fff8ed;
  color: #342f2b;
  position: relative;
  padding: 85px 0 62px;
}
.hop-v12-intro-inner {
  display: grid;
  grid-template-columns: minmax(0, .83fr) minmax(0, 1.17fr);
  gap: clamp(35px,6.5vw,94px);
  align-items: start;
}
.hop-v12-intro-identity {
  border-top: 2px solid #c99567;
  padding-top: 25px;
}
.hop-v12-intro h1 {
  font: normal clamp(3rem,4.5vw,4.6rem)/1.1 Georgia,'Times New Roman',serif;
  letter-spacing: -.045em;
  margin: 17px 0 22px;
  color: #263c37;
}
.hop-v12-intro .hop-gateway__section-label {
  color: #8e613e;
  letter-spacing: .16em;
}
.hop-v12-portal-distinction {
  font-size: .92rem;
  line-height: 1.8;
  max-width: 330px;
  color: #635b51;
}
.hop-v12-intro h2 {
  font: normal clamp(2.25rem,3.6vw,3.75rem)/1.15 Georgia,'Times New Roman',serif;
  letter-spacing: -.045em;
  margin: 0 0 24px;
  max-width: 720px;
  color: #342f2b;
}
.hop-v12-intro h2 em {
  color: #af704d;
  font-weight: 400;
}
.hop-v12-intro-message > p {
  font-size: 1.03rem;
  line-height: 1.78;
  max-width: 720px;
  color: #5a534b;
  margin: 0 0 17px;
}
.hop-v12-intro-message > p.hop-v12-intro-lead {
  font-size: 1.18rem;
  color: #3e4b43;
}
.hop-v12-actions {
  margin-top: 31px;
}
.hop-v12-actions .hop-gateway__button--dark {
  background: #365b4c;
}
.hop-v12-actions .hop-gateway__button--dark:hover {
  background: #244338;
}
.hop-v12-verified {
  margin-top: 20px!important;
  font-size: .89rem!important;
}
.hop-v12-verified a { color: #725039; text-underline-offset: 4px; text-decoration: underline; }
.hop-v12-scroll-cue {
  display: flex;
  align-items: center;
  justify-content: center;
  width: fit-content;
  gap: 18px;
  color: #77563d!important;
  font-size: .75rem;
  letter-spacing: .09em;
  margin: 46px auto 0;
  text-decoration: underline!important;
  text-underline-offset: 5px;
}
.hop-v12-scroll-cue span { font-size: 1.25rem; }
@media (max-width: 1024px) {
  .hop-v12-nav {
    min-height: 83px;
  }
  .hop-v12-links { gap: 12px 18px; }
  .hop-v12-intro-inner { gap: 35px; }
}
@media (max-width: 760px) {
  .hop-v12-nav {
    padding: 19px 0 22px;
    flex-wrap: wrap;
    align-items: start;
  }
  .hop-v12-links {
    justify-content: flex-start;
    width: 100%;
    gap: 14px 22px;
  }
  .hop-v12-intro {
    padding: 57px 0 48px;
  }
  .hop-v12-intro-inner {
    display: block;
  }
  .hop-v12-intro-identity {
    padding: 19px 0 13px;
    margin-bottom: 26px;
  }
  .hop-v12-intro h1 {
    font-size: clamp(3rem,8.4vw,4.2rem);
    margin: 10px 0 14px;
  }
  .hop-v12-intro .hop-v12-portal-distinction { max-width: 100%; }
  .hop-v12-intro h2 { font-size: clamp(2.25rem,7vw,3.15rem); }
  .hop-v12-scroll-cue { margin-top: 28px; }
}
@media (max-width: 420px) {
  .hop-v12-nav { gap: 13px; }
  .hop-v12-navband .hop-gateway__brand { white-space: nowrap; }
  .hop-v12-links { gap: 9px 14px; }
  .hop-v12-links a { font-size: .77rem; }
  .hop-v12-links .hop-gateway__nav-portal { padding: 9px 10px; }
  .hop-v12-scene figcaption {
    font-size: .70rem;
    padding: 10px 17px;
  }
  .hop-v12-intro h1 { font-size: clamp(2.7rem,10vw,3.45rem); }
  .hop-v12-intro .hop-gateway__section-label { letter-spacing: .11em; }
  .hop-v12-actions { display: flex; flex-direction: column; }
  .hop-v12-actions .hop-gateway__button { width: 100%; }
}


/* v1.2 Header Identity & Mobile Navigation Refinement
   Exact legacy House of Pereira navigation crest used as a small derived web raster.
   The public Gateway links and separate verified Portal doorway occupy deliberate rows. */
.hop-v12-navband .hop-v12-nav {
  display: grid;
  grid-template-columns: auto minmax(0,1fr) auto;
  grid-template-areas: "identity pages portal";
  align-items: center;
  column-gap: clamp(12px, 2.2vw, 30px);
}
.hop-v12-navband .hop-v12-brand {
  grid-area: identity;
  display: inline-flex;
  align-items: center;
  gap: 10px;
  min-width: 0;
  color: #fff9ec;
  flex-shrink: 0;
  text-decoration: none;
}
.hop-v12-brandmark {
  display: block;
  width: 44px;
  height: 44px;
  flex: 0 0 44px;
}
.hop-v12-brandmark img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: contain;
}
.hop-v12-wordmark {
  white-space: nowrap;
  font-size: .76rem;
  font-weight: 750;
  letter-spacing: .14em;
  line-height: 1.2;
}
.hop-v12-navband .hop-v12-links {
  grid-area: pages;
  display: flex;
  flex-wrap: nowrap;
  gap: clamp(10px, 1.8vw, 28px);
  justify-content: flex-end;
  min-width: 0;
}
.hop-v12-navband .hop-v12-links a {
  display: inline-flex;
  align-items: center;
  min-height: 44px;
  white-space: nowrap;
}
.hop-v12-navband .hop-v12-portal {
  grid-area: portal;
  display: inline-flex;
  justify-content: center;
  align-items: center;
  min-height: 44px;
  gap: 6px;
  padding: 9px 12px;
  color: #fff9ec;
  font-size: .83rem;
  font-weight: 600;
  text-decoration: none;
  white-space: nowrap;
}
.hop-v12-navband a:focus-visible {
  outline: 2px solid #f0c782;
  outline-offset: 4px;
}
.hop-v12-navband a:hover {
  text-decoration: underline;
  text-underline-offset: 5px;
}
@media (max-width: 760px) {
  .hop-v12-navband .hop-v12-nav {
    grid-template-columns: minmax(0, 1fr) auto;
    grid-template-rows: minmax(44px, auto) minmax(44px, auto);
    grid-template-areas: "identity portal" "pages pages";
    gap: 11px 9px;
    padding: 15px 0 14px;
    align-items: center;
  }
  .hop-v12-navband .hop-v12-brand {
    min-width: 0;
    gap: 8px;
  }
  .hop-v12-brandmark {
    width: 40px;
    height: 40px;
    flex-basis: 40px;
  }
  .hop-v12-wordmark {
    font-size: .68rem;
    letter-spacing: .075em;
  }
  .hop-v12-navband .hop-v12-links {
    width: 100%;
    display: grid;
    grid-template-columns: repeat(3, max-content);
    align-items: center;
    justify-content: space-between;
    column-gap: 9px;
  }
  .hop-v12-navband .hop-v12-links a {
    min-height: 44px;
    font-size: .82rem;
    line-height: 1.25;
  }
  .hop-v12-navband .hop-v12-portal {
    min-height: 44px;
    padding: 9px 11px;
    font-size: .81rem;
  }
}
@media (max-width: 370px) {
  .hop-v12-wordmark {
    font-size: .63rem;
    letter-spacing: .045em;
  }
  .hop-v12-navband .hop-v12-portal {
    font-size: .76rem;
    padding-inline: 9px;
  }
  .hop-v12-navband .hop-v12-links a {
    font-size: .78rem;
  }
}


/* Reuse the refined navigation inside the existing About/Research/Connect heroes
   without changing those pages' scenic backgrounds or editorial copy. */
.hop-v12-subpage-header.hop-v12-navband {
  display: block;
  min-height: 0;
  padding: 0;
  background: transparent;
  border-bottom: 1px solid rgba(255,255,255,.19);
}
.hop-v12-subpage-header .hop-v12-subpage-nav {
  width: 100%;
  min-height: 88px;
}
@media (max-width: 760px) {
  .hop-v12-subpage-header .hop-v12-subpage-nav {
    min-height: 0;
  }
}


/* v1.3 | House of Pereira brand expression and Pacific atmosphere
   Brand lettering is live text, with no external typeface download.
   Coastal ambience is a crop of the unchanged supplied scenic master.
   Botanical lines and emboss texture are contemporary design ornament,
   not copies of traditional Samoan, Tokelauan or ceremonial motifs. */

.hop-v13-signature {
  display: inline;
  font-family: "Palatino Linotype", "Book Antiqua", Georgia, serif;
  font-style: italic;
  font-weight: 400;
  letter-spacing: -.043em;
  text-transform: none;
  line-height: 1.18;
  white-space: nowrap;
}
.hop-v13-signature em {
  color: #f0c782;
  font-size: .78em;
  font-weight: 400;
  letter-spacing: -.025em;
}
.hop-v12-navband .hop-v13-signature--nav {
  color: #fff5e8;
  font-size: clamp(1rem,1.32vw,1.28rem);
  font-weight: 400;
}
.hop-v12-navband .hop-v12-brand {
  gap: 10px;
}

/* Architectural images: quiet secondary atmosphere, never an alternate
   homepage-style cinematic scene. No depicted geography is claimed as fact. */
.hop-v13-about .hop-v11-page-hero,
.hop-v13-research .hop-v11-page-hero,
.hop-v13-connect .hop-gateway__scene--short {
  position: relative;
  isolation: isolate;
  overflow: hidden;
}
.hop-v13-about .hop-v11-page-hero::before,
.hop-v13-research .hop-v11-page-hero::before,
.hop-v13-connect .hop-gateway__scene--short::before {
  content: "";
  position: absolute;
  pointer-events: none;
  inset: 0 0 0 42%;
  background-image: url("/assets/pacific-coastal-atmosphere.jpg");
  background-position: right center;
  background-size: cover;
  background-repeat: no-repeat;
  opacity: .32;
  -webkit-mask-image: linear-gradient(90deg,transparent 0%,#000 50%);
  mask-image: linear-gradient(90deg,transparent 0%,#000 50%);
  z-index: 0;
}
.hop-v13-about .hop-v11-page-hero::after,
.hop-v13-research .hop-v11-page-hero::after,
.hop-v13-connect .hop-gateway__scene--short::after {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  background: linear-gradient(90deg,rgba(21,48,46,.18) 0%,rgba(22,47,43,.11) 53%,rgba(17,40,39,.35) 100%);
  z-index: 0;
}
.hop-v13-about .hop-v11-page-hero > .hop-gateway__inner,
.hop-v13-research .hop-v11-page-hero > .hop-gateway__inner,
.hop-v13-connect .hop-gateway__scene--short > .hop-gateway__inner {
  position: relative;
  z-index: 1;
}
.hop-v13-about .hop-v11-page-hero {
  background: radial-gradient(ellipse at 95% 80%,rgba(220,164,103,.26),transparent 46%), linear-gradient(114deg,#223c39,#625044 100%);
}
.hop-v13-research .hop-v11-page-hero {
  background: radial-gradient(ellipse at 95% 70%,rgba(166,179,143,.24),transparent 53%),linear-gradient(116deg,#1c3835,#465c51 76%,#665447 100%);
}
.hop-v13-research .hop-v11-page-hero::before {
  background-position: 88% 65%;
  opacity: .23;
}
.hop-v13-connect .hop-gateway__scene--short {
  background: radial-gradient(ellipse at 80% 60%,rgba(239,179,114,.2),transparent 47%),linear-gradient(114deg,#243c36,#695044);
}
.hop-v13-connect .hop-gateway__scene--short::before {
  opacity: .30;
  background-position: 92% 60%;
}
.hop-v13-about .hop-v11-page-hero .hop-v11-page-heading,
.hop-v13-research .hop-v11-page-hero .hop-v11-page-heading,
.hop-v13-connect .hop-gateway__scene--short .hop-gateway__hero {
  position: relative;
}
.hop-v13-about .hop-v11-page-hero h1,
.hop-v13-research .hop-v11-page-hero h1,
.hop-v13-connect .hop-gateway__scene--short h1 {
  text-shadow: 0 2px 28px rgba(8,28,28,.28);
}

/* Contemporary coastal frond line work, subtle supporting character only. */
.hop-v13-about .hop-v11-editorial-paper,
.hop-v13-research .hop-v11-editorial-paper,
.hop-v13-connect .hop-gateway__paths,
.hop-v11-letter {
  position: relative;
  isolation: isolate;
  overflow: hidden;
}
.hop-v13-about .hop-v11-editorial-paper::after,
.hop-v13-research .hop-v11-editorial-paper::after,
.hop-v13-connect .hop-gateway__paths::after,
.hop-v11-letter::before {
  content: "";
  position: absolute;
  right: -52px;
  bottom: -66px;
  width: clamp(190px,29vw,360px);
  height: clamp(245px,38vw,460px);
  background: url("/assets/coastal-fronds-outline.svg") center / contain no-repeat;
  opacity: .21;
  pointer-events: none;
  z-index: 0;
}
.hop-v11-letter::before {
  right: auto;
  left: -100px;
  transform: scaleX(-1);
  opacity: .10;
}
.hop-v13-research .hop-v11-editorial-paper::after {
  opacity: .13;
  right: -102px;
}
.hop-v13-connect .hop-gateway__paths::after {
  opacity: .11;
  right: -110px;
}
.hop-v13-about .hop-v11-editorial-paper > *,
.hop-v13-research .hop-v11-editorial-paper > *,
.hop-v13-connect .hop-gateway__paths > *,
.hop-v11-letter > * {
  position: relative;
  z-index: 1;
}
.hop-v13-about .hop-v11-editorial-paper,
.hop-v13-research .hop-v11-editorial-paper {
  background: linear-gradient(160deg,#f0e6d7,#f8eee0 72%,#ede1d2);
}

/* v1.4 shared minimal footer. Existing family destinations and verification text remain visible.
   Restrained neutral line texture only, not a culturally attributed textile pattern. */
.hop-v13-footer {
  position:relative; isolation:isolate; overflow:hidden;
  background:#092b2d !important;
  border-top:1px solid rgba(229,192,133,.36);
  padding:0; color:#e9e4d7;
}
.hop-v13-footer::before {
  content:""; position:absolute; inset:0; pointer-events:none;
  background:repeating-linear-gradient(45deg,transparent 0 22px,rgba(233,213,183,.12) 23px,transparent 24px 46px);
  opacity:.07;
}
.hop-v13-footer::after {content:none;}
.hop-v13-footer .hop-v14-footer-wrap {
  display:flex; flex-direction:column; align-items:center; text-align:center;
  position:relative; z-index:1;
  padding-top:23px; padding-bottom:14px; gap:6px;
}
.hop-v13-footer-brand {
  display:inline-flex; align-items:center; gap:9px;
  color:#f7eee0 !important; text-decoration:none;
}
.hop-v13-footer-brand img {display:block;width:32px;height:32px;object-fit:contain;}
.hop-v13-footer .hop-v13-signature--footer {
  font:normal 1.28rem/1.13 Georgia,serif; letter-spacing:-.035em;
  color:#fff5e4;
}
.hop-v13-footer .hop-v13-footer-familyline {
  color:#d7c19c !important; margin:0;
  font:.58rem/1.3 Georgia,serif !important; letter-spacing:.14em;
}
.hop-v13-footer .hop-v14-footer-links {
  display:flex;justify-content:center;align-items:center;
  gap:1px 18px;flex-wrap:wrap;
  padding:9px 0 0; margin:0;
}
.hop-v13-footer .hop-v14-footer-links a {
  color:#ece7d9; font-size:.75rem; line-height:1.5;
  text-decoration:none; white-space:normal;
  padding:5px 0; min-height:26px;
}
.hop-v13-footer .hop-v14-footer-links a:hover {text-decoration:underline;text-underline-offset:4px;}
.hop-v13-footer .hop-v13-footer-boundary {
  color:#aebfb7; max-width:860px;
  font-size:.66rem;line-height:1.55;
  margin:6px 0 0; padding:9px 0 0;
  border-top:1px solid rgba(229,202,153,.16);
}
.hop-v13-footer .hop-v13-footer-bottom {
  display:flex; justify-content:center;align-items:center;flex-wrap:wrap;
  gap:6px 18px; width:100%; border-top:1px solid rgba(229,202,153,.12);
  padding-top:10px; margin-top:9px;
  color:#aec3b9; font-size:.65rem; letter-spacing:.01em;
}
.hop-v13-footer a:focus-visible {outline:2px solid #f0c782;outline-offset:4px;}
@media (max-width:600px) {
  .hop-v13-footer .hop-v14-footer-wrap {padding-top:22px;padding-bottom:13px;}
  .hop-v13-footer .hop-v14-footer-links {gap:1px 15px;}
  .hop-v13-footer .hop-v14-footer-links a {font-size:.72rem;}
  .hop-v13-footer .hop-v13-footer-boundary {font-size:.64rem;}
}

/* House of Pereira v1.4 Gate C2A
   Approved LOCAL LAYOUT STUDY ONLY. These CSS-only atmosphere zones contain NO
   licensed/final imagery or culturally specific visual motifs. */
.hop-v14-layout-study {
  --v14-paper: #fff8ed;
  --v14-deep: #163633;
  --v14-ink: #253c36;
  --v14-gold: #efc887;
  background: var(--v14-paper);
}
.hop-v14-layout-study .hop-v12-navband {
  position: relative;
  z-index: 4;
  background: linear-gradient(95deg, #142f30 0%, #1d413d 55%, #173431 100%);
  border-bottom: 1px solid rgba(238,204,147,.42);
  box-shadow: 0 5px 22px rgba(6,27,27,.14);
}
.hop-v14-layout-study .hop-v12-subpage-header.hop-v12-navband {
  background: rgba(17,47,45,.9);
  border-bottom: 1px solid rgba(238,204,147,.36);
  padding: 0;
  margin-inline: auto;
}
.hop-v14-layout-study .hop-v12-navband .hop-v12-portal:hover {
  color: #ffe3af;
  border-bottom-color: #ffe3af;
}
.hop-v14-layout-study .hop-v12-navband .hop-v12-links a:hover { color: #ffe0a3; }

/* Homepage: deliberate split between truthful, live copy and editorial brand.
   Gradient surface is an empty scenery placeholder, not an invented landscape. */
.hop-v14-home-hero {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  min-height: 700px;
  padding: clamp(62px,7vw,104px) 0 102px;
  color: #fff9e8;
  background:
    radial-gradient(ellipse 50% 62% at 79% 27%, rgba(247,185,101,.46), transparent 65%),
    radial-gradient(ellipse 44% 35% at 68% 84%, rgba(180,171,114,.20), transparent 80%),
    linear-gradient(122deg, #143836 0%, #245650 42%, #56867c 75%, #9b8c65 100%);
}
.hop-v14-home-hero::before {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  z-index: 0;
  background: linear-gradient(90deg, rgba(7,31,31,.82) 0%, rgba(10,40,39,.58) 42%, rgba(17,47,44,.23) 74%, rgba(17,47,44,.17) 100%);
}
.hop-v14-home-horizon {
  position: absolute;
  z-index: 0;
  left: 0; right: 0; bottom: 0;
  height: 33%;
  background: linear-gradient(180deg, rgba(36,99,97,.12), rgba(12,62,65,.66));
  clip-path: polygon(0 40%, 12% 34%, 25% 39%, 37% 28%, 50% 35%, 61% 30%, 74% 37%, 88% 22%, 100% 32%, 100% 100%, 0 100%);
  pointer-events: none;
}
.hop-v14-home-hero::after,
.hop-v14-layout-study .hop-v14-page-stage::after {
  content: "";
  position: absolute;
  z-index: 2;
  pointer-events: none;
  inset: auto 0 -2px 0;
  height: clamp(43px,6vw,85px);
  width: 100%;
  border-radius: 54% 46% 0 0 / 90% 88% 0 0;
  background: var(--v14-paper);
}
.hop-v14-home-grid {
  position: relative;
  z-index: 3;
  display: grid;
  grid-template-columns: minmax(0,1.25fr) minmax(0,.8fr);
  column-gap: clamp(50px,7vw,124px);
  align-items: center;
}
.hop-v14-home-copy { min-width: 0; max-width: 680px; text-shadow: 0 2px 15px rgba(8,29,27,.18); }
.hop-v14-eyebrow, .hop-v14-brand-kicker {
  display: block;
  margin: 0 0 23px;
  font-size: .73rem;
  letter-spacing: .22em;
  font-weight: 750;
  color: #ffe0a8;
}
.hop-v14-home-copy h1 {
  font: normal clamp(3.4rem,6.5vw,6.5rem)/.98 Georgia, "Times New Roman", serif;
  letter-spacing: -.056em;
  margin: 0 0 22px;
  color: #fff7ea;
}
.hop-v14-home-copy h2 {
  font: normal clamp(1.85rem,2.9vw,3.05rem)/1.13 Georgia, "Times New Roman", serif;
  margin: 0 0 17px;
  letter-spacing: -.034em;
  color: #fff5e5;
}
.hop-v14-home-copy h2 em { font-weight: normal; color: #f5ce92; }
.hop-v14-home-copy > p:not(.hop-v14-eyebrow):not(.hop-v12-verified) {
  color: #f0eee3;
  line-height: 1.66;
  max-width: 600px;
  font-size: clamp(.99rem,1.25vw,1.11rem);
  margin: 0 0 13px;
}
.hop-v14-home-copy > p.hop-v14-lead { font-size: clamp(1.08rem,1.55vw,1.25rem)!important; color: #fff8e9!important; }
.hop-v14-home-copy .hop-v12-actions { margin-top: 24px; }
.hop-v14-home-copy .hop-gateway__button--primary { background: #efc887; color: #1b3631; }
.hop-v14-home-copy .hop-gateway__button--dark {
  background: rgba(15,49,46,.83);
  border: 1px solid rgba(249,228,192,.7);
}
.hop-v14-home-copy .hop-v12-verified { margin-top: 20px!important; }
.hop-v14-home-copy .hop-v12-verified a { color: #fff0ce; }
.hop-v14-home-brand {
  justify-self: end;
  width: min(100%, 390px);
  border-left: 1px solid rgba(247,215,163,.67);
  padding: 19px 0 19px clamp(25px,3vw,48px);
}
.hop-v14-brand-title {
  font: normal clamp(2.5rem,4.3vw,4.5rem)/1.04 Georgia, "Times New Roman", serif;
  letter-spacing: -.052em;
  margin: 0 0 22px;
  color: #fff4dc;
}
.hop-v14-brand-title em { font-size:.68em; font-weight: normal; color: #f0c782; }
.hop-v14-brand-line { color:#f9d8a1; font-size:.79rem; letter-spacing:.11em; margin: 0 0 20px; }
.hop-v14-home-brand .hop-v12-portal-distinction { color:#fff0dc; font-size:.87rem; line-height:1.7; max-width:330px; }
.hop-v14-layout-note {
  position: relative; z-index: 3;
  width: min(1200px, calc(100% - 64px)); margin: 26px auto 0;
  color: #ffe0ab; font-size: .74rem; letter-spacing: .035em;
}
.hop-v14-scroll-cue {
  position: relative; z-index: 3; display:flex; justify-content:center; gap:15px;
  width:fit-content; margin:21px auto 0; color:#fff5de;
  text-decoration:underline!important; text-underline-offset:5px; font-size:.79rem;
}
.hop-v14-scroll-cue span { font-size:1.2rem; }

/* Three owner-supplied interpretive scenic heroes, isolated from private Portal and body content.
   One H1 family visual language: centered image composition + HOME WAVE PATH at a deeper height.
   Source masters outside public; no added browser scripts or source ancestry claims. */
.hop-v14-layout-study .hop-v14-page-stage {
  --hop-inner-paper:#fff8ed;
  --hop-inner-image-height:clamp(270px,34vw,485px);
  --hop-inner-wave-height:clamp(95px,11vw,170px);
  --hop-inner-copy-lift:clamp(68px,7vw,100px);
  position:relative;
  isolation:isolate;
  overflow:hidden;
  display:block;
  min-height:0;
  color:#332f29;
  background:var(--hop-inner-paper);
}
.hop-v14-layout-study .hop-v14-page-stage::before,
.hop-v14-layout-study .hop-v14-page-stage::after {
  content:none;
  display:none;
}
.hop-v14-layout-study .hop-v14-inner-media {
  position:relative; z-index:0;
  height:var(--hop-inner-image-height);
  overflow:hidden;
  background:#1a3938;
}
.hop-v14-layout-study .hop-v14-inner-media img {
  display:block;
  width:100%;height:100%;
  object-fit:cover;
  object-position:50% 50%;
}
.hop-v14-layout-study .hop-v14-inner-media::after {
  content:"";position:absolute;inset:0;pointer-events:none;
  background:linear-gradient(180deg,rgba(4,27,29,.07),transparent 35%,rgba(7,31,30,.1));
}
/* H1 inner-hero family signature: same three-line homepage brand, white top-right.
   Positioned only within the scenic image, without changing the wave or lower page copy. */
:is(.hop-v14-layout-study .hop-v14-page-stage, .hop-v14-home .hop-h1-photo-hero) > .hop-v14-inner-brand {
  position:absolute;z-index:3;
  top:clamp(16px,2.5vw,37px);
  right:max(26px,calc((100% - 1120px)/2));
  width:min(49vw,535px);
  margin:0;
  text-align:center;
  color:#ffffff;
  pointer-events:none;
  text-shadow:0 2px 8px rgba(7,25,25,.88),0 1px 22px rgba(7,25,25,.75);
}
:is(.hop-v14-layout-study .hop-v14-page-stage, .hop-v14-home .hop-h1-photo-hero) > .hop-v14-inner-brand .hop-h1-brand-title {
  font:normal clamp(2.1rem,3.5vw,3.36rem)/1.09 Georgia,"Times New Roman",serif;
  letter-spacing:-.046em;
  color:#ffffff;
  margin:0 0 5px;
  white-space:nowrap;
}
:is(.hop-v14-layout-study .hop-v14-page-stage, .hop-v14-home .hop-h1-photo-hero) > .hop-v14-inner-brand .hop-h1-brand-tagline {
  font:normal clamp(.62rem,.82vw,.77rem)/1.4 Georgia,serif;
  letter-spacing:.15em;
  color:#ffffff;
  margin:0;
  white-space:nowrap;
}
/* The owner's HOP floral line is intentionally subordinate to the family name. */
:is(.hop-v14-layout-study .hop-v14-page-stage, .hop-v14-home .hop-h1-photo-hero) > .hop-v14-inner-brand .hop-h1-brand-rule {
  display:flex;align-items:center;justify-content:center;
  width:min(46%,225px);margin:8px auto 0;
  padding:0;line-height:0;
}
:is(.hop-v14-layout-study .hop-v14-page-stage, .hop-v14-home .hop-h1-photo-hero) > .hop-v14-inner-brand .hop-h1-brand-rule::before,
:is(.hop-v14-layout-study .hop-v14-page-stage, .hop-v14-home .hop-h1-photo-hero) > .hop-v14-inner-brand .hop-h1-brand-rule::after {
  content:none;display:none;
}
:is(.hop-v14-layout-study .hop-v14-page-stage, .hop-v14-home .hop-h1-photo-hero) > .hop-v14-inner-brand .hop-h1-brand-rule img {
  display:block;width:100%;height:auto;
  max-height:42px;object-fit:contain;
  filter:drop-shadow(0 1px 3px rgba(6,22,23,.58));
}
@media(max-width:1024px) {
  :is(.hop-v14-layout-study .hop-v14-page-stage, .hop-v14-home .hop-h1-photo-hero) > .hop-v14-inner-brand {
    right:clamp(16px,3vw,32px);
    width:min(56vw,445px);
  }
  :is(.hop-v14-layout-study .hop-v14-page-stage, .hop-v14-home .hop-h1-photo-hero) > .hop-v14-inner-brand .hop-h1-brand-title {
    font-size:clamp(1.55rem,3.1vw,2.65rem);
  }
}
@media(max-width:760px) {
  :is(.hop-v14-layout-study .hop-v14-page-stage, .hop-v14-home .hop-h1-photo-hero) > .hop-v14-inner-brand {
    top:clamp(14px,3.5vw,23px);
    right:clamp(12px,4vw,24px);
    width:min(67vw,300px);
  }
  :is(.hop-v14-layout-study .hop-v14-page-stage, .hop-v14-home .hop-h1-photo-hero) > .hop-v14-inner-brand .hop-h1-brand-title {
    font-size:clamp(1.07rem,5.25vw,1.95rem);
    white-space:normal;
    margin-bottom:3px;
  }
  :is(.hop-v14-layout-study .hop-v14-page-stage, .hop-v14-home .hop-h1-photo-hero) > .hop-v14-inner-brand .hop-h1-brand-tagline {
    font-size:clamp(.36rem,1.53vw,.55rem);
    letter-spacing:.08em;
    white-space:normal;
  }
  :is(.hop-v14-layout-study .hop-v14-page-stage, .hop-v14-home .hop-h1-photo-hero) > .hop-v14-inner-brand .hop-h1-brand-rule {
    width:min(65%,170px);
    margin-top:6px;
  }
}
.hop-v14-layout-study .hop-v14-inner-wave {
  position:relative;z-index:2;
  height:var(--hop-inner-wave-height);
  margin-top:calc(-1 * var(--hop-inner-wave-height));
  width:100%;line-height:0;pointer-events:none;
}
.hop-v14-layout-study .hop-v14-inner-wave svg {display:block;width:100%;height:calc(100% + 3px);}
.hop-v14-layout-study .hop-v14-inner-wave path {fill:var(--hop-inner-paper);}
.hop-v14-layout-study .hop-v14-page-stage > .hop-gateway__inner {
  position:relative;z-index:3;
  margin-top:calc(-1 * var(--hop-inner-copy-lift));
}
.hop-v14-layout-study .hop-v14-page-stage .hop-v11-page-heading,
.hop-v14-layout-study .hop-v14-page-stage .hop-gateway__hero--short {
  max-width:890px;
  padding:clamp(25px,3vw,45px) 0 clamp(66px,7vw,100px);
  margin:0;
}
.hop-v14-layout-study .hop-v14-page-stage .hop-gateway__eyebrow {
  color:#97683f;
  margin:0 0 14px;
  text-shadow:none;
}
.hop-v14-layout-study .hop-v14-page-stage h1 {
  color:#2d3330;
  text-shadow:none;
  font:normal clamp(2.8rem,5vw,5.2rem)/1.08 Georgia,'Times New Roman',serif;
  letter-spacing:-.043em;
  margin:0 0 18px;
}
.hop-v14-layout-study .hop-v14-page-stage h1 em {
  display:block;
  color:#b77d56;
  font-weight:400;
}
.hop-v14-layout-study .hop-v14-page-stage .hop-v11-page-heading > p:not(.hop-gateway__eyebrow):not(.hop-v14-inner-art-caption),
.hop-v14-layout-study .hop-v14-page-stage .hop-gateway__intro {
  color:#514d47;
  font-size:clamp(1rem,1.45vw,1.2rem);
  line-height:1.7;
  margin:0;
  max-width:790px;
  text-shadow:none;
}
.hop-v14-layout-study .hop-v14-page-stage .hop-v14-inner-art-caption {
  margin:19px 0 0;
  color:#826c55;
  font:500 .73rem/1.6 system-ui,sans-serif;
  letter-spacing:.025em;
}
@media(max-width:760px) {
  .hop-v14-layout-study .hop-v14-page-stage {
    --hop-inner-image-height:clamp(248px,61vw,360px);
    --hop-inner-wave-height:clamp(82px,23vw,122px);
    --hop-inner-copy-lift:clamp(49px,15vw,68px);
  }
  .hop-v14-layout-study .hop-v14-page-stage .hop-v11-page-heading,
  .hop-v14-layout-study .hop-v14-page-stage .hop-gateway__hero--short {
    padding:22px 0 58px;
  }
  .hop-v14-layout-study .hop-v14-page-stage h1 {font-size:clamp(2.45rem,9vw,3.8rem);}
}
@media(max-width:420px) {
  .hop-v14-layout-study .hop-v14-page-stage .hop-gateway__eyebrow {font-size:.65rem;}
  .hop-v14-layout-study .hop-v14-page-stage .hop-v14-inner-art-caption {font-size:.67rem;}
}
.hop-v14-layout-study .hop-v11-editorial,
.hop-v14-layout-study .hop-gateway__paths { background: var(--v14-paper); }
.hop-v14-layout-study .hop-v11-editorial-paper,
.hop-v14-layout-study .hop-v13-research .hop-v11-editorial-paper {
  background: linear-gradient(165deg,#f5e9d9,#fff8ed 70%,#f4e9d7);
}
.hop-v14-layout-study .hop-v11-editorial-paper::after,
.hop-v14-layout-study .hop-gateway__paths::after { opacity: 0; }
.hop-v14-layout-study .hop-v11-letter::before { opacity: .045; }
@media (max-width: 1024px) {
  .hop-v14-home-grid { column-gap: 36px; grid-template-columns: minmax(0,1.35fr) minmax(0,.65fr); }
  .hop-v14-home-brand { padding-left: 25px; }
  .hop-v14-brand-title { font-size: clamp(2.2rem,4vw,3.6rem); }
}
@media (max-width: 760px) {
  .hop-v14-home-hero { min-height: 0; padding: 51px 0 88px; }
  .hop-v14-home-grid { display: block; }
  .hop-v14-home-copy h1 { font-size: clamp(2.85rem, 9.2vw, 4.5rem); }
  .hop-v14-home-brand {
    width: 100%; max-width: none;
    margin-top: 39px; padding: 19px 0 0;
    border-left: 0; border-top: 1px solid rgba(247,215,163,.48);
  }
  .hop-v14-brand-kicker { margin-bottom: 12px; }
  .hop-v14-brand-title { font-size: clamp(2.15rem,7vw,3.5rem); margin-bottom: 12px; }
  .hop-v14-home-brand .hop-v12-portal-distinction { max-width: 530px; }
}
@media (max-width: 420px) {
  .hop-v14-home-copy h1 { font-size: 2.7rem; }
  .hop-v14-home-copy h2 { font-size: 2rem; }
  .hop-v14-home-grid { width: calc(100% - 36px); }
  .hop-v14-layout-note { width: calc(100% - 36px); }
  .hop-v14-home-hero::after { height: 40px; }
}
@media (prefers-reduced-motion: reduce) {
  .hop-v14-layout-study .hop-gateway__button { transition: none; }
}



/* HOP Gate C2A-H1: HOME HERO ONLY. Do not influence inner pages or below-hero content. */
.hop-v14-site .hop-v12-navband {
  background: #06282c;
  border-bottom: 0;
  box-shadow: none;
}
.hop-v14-site .hop-v12-navband .hop-v12-nav {
  min-height: 72px;
  max-width: 1100px;
  padding-block: 6px;
  grid-template-columns: minmax(0,1fr) auto auto;
  column-gap: 26px;
}
.hop-v14-site .hop-v12-brandmark {
  flex: 0 0 62px;
  width: 62px;
  height: 62px;
}
.hop-v14-site .hop-h1-navtype {
  display: flex;
  min-width: 0;
  flex-direction: column;
  gap: 2px;
}
.hop-v14-site .hop-h1-navtype .hop-v13-signature--nav {
  font: normal 29px/1 Georgia, "Times New Roman",serif;
  color: #fff8e9;
  letter-spacing: -.035em;
  white-space: nowrap;
}
.hop-v14-site .hop-h1-navtagline {
  font: normal 10px/1.2 Georgia,serif;
  color: #e8e7d9;
  letter-spacing: .13em;
  white-space: nowrap;
}
.hop-v14-site .hop-v12-navband .hop-v12-links {
  gap: 15px;
}
.hop-v14-site .hop-v12-navband .hop-v12-links a {
  font-size: .86rem;
  font-weight: 500;
}
.hop-v14-site .hop-v12-navband .hop-v12-portal {
  color: #f0c782;
  font-size: .8rem;
  font-weight: 650;
  letter-spacing: .015em;
  border: 0;
  border-bottom: 1px solid rgba(240,199,130,.78);
  border-radius: 0;
  background: transparent;
  box-shadow: none;
  padding: 8px 1px 7px;
}
.hop-v14-site .hop-v12-navband .hop-v12-portal::before {
  content: "";
  width: 6px;
  height: 6px;
  flex: 0 0 6px;
  border: 1px solid currentColor;
  transform: rotate(45deg);
  margin-right: 3px;
}
.hop-v14-home .hop-h1-photo-hero {
  position: relative;
  isolation: isolate;
  background: #264240;
  min-height: 500px;
  overflow: hidden;
  color: #fff7ed;
}
.hop-v14-home .hop-h1-photo {
  position: absolute;
  inset: 0;
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center 57%;
  transform: scaleX(-1);
  z-index: 0;
}
.hop-v14-home .hop-h1-vignette {
  position: absolute;
  z-index: 1;
  inset: 0;
  pointer-events: none;
  background: linear-gradient(90deg,
    rgba(2,18,22,.76) 0%,
    rgba(5,23,27,.60) 29%,
    rgba(9,27,30,.16) 57%,
    rgba(11,30,33,.06) 70%,
    rgba(7,23,27,.07) 100%);
}
.hop-v14-home .hop-h1-stage {
  position: relative;
  z-index: 2;
  width: min(1100px, calc(100% - 64px));
  min-height: 500px;
  margin-inline: auto;
  display: grid;
  grid-template-columns: minmax(0, 475px) minmax(0, 1fr);
  align-items: start;
  gap: clamp(70px, 11vw, 185px);
  padding-top: 45px;
  padding-bottom: 64px;
}
.hop-v14-home .hop-h1-left {
  position:absolute;z-index:3;
  top:clamp(148px,13vw,197px);
  right:max(26px,calc((100% - 1120px)/2));
  width:min(49vw,535px);
  min-width:0;
  color:#ffffff;
  text-align:center;
  text-shadow:0 2px 8px rgba(7,25,25,.85);
}
/* Preserve a single accessible H1 while removing duplicated scenic title lettering. */
.hop-v14-home .hop-h1-visually-hidden {
  position:absolute!important;
  width:1px!important;height:1px!important;
  padding:0!important;margin:-1px!important;
  overflow:hidden!important;clip:rect(0,0,0,0)!important;
  white-space:nowrap!important;border:0!important;
}
.hop-v14-home .hop-h1-left h1 {
  font: normal clamp(2.7rem,3.4vw,3.35rem)/1.05 Georgia, "Times New Roman",serif;
  margin: 0 0 5px;
  letter-spacing: -.045em;
  color: #fff7ee;
}
.hop-v14-home .hop-h1-left h2 {
  font: italic 29px/1.07 Georgia,"Times New Roman",serif;
  letter-spacing: -.045em;
  color: #fff2df;
  font-weight: 400;
  margin: 0 0 11px;
}
.hop-v14-home .hop-h1-left h2 em {
  color: #f2d5a5;
  font-weight: normal;
}
.hop-v14-home .hop-h1-left p:not(.hop-h1-verified) {
  margin: 0 0 7px;
  color: #fff6e8;
  line-height: 1.38;
  font-size: 13px;
}
.hop-v14-home .hop-h1-left .hop-h1-lead { max-width: 450px; }
.hop-v14-home .hop-h1-left .hop-h1-detail { max-width: 460px; }
.hop-v14-home .hop-h1-actions {
  gap: 8px;
  display: flex;
  flex-wrap: wrap;
  justify-content:center;
  margin-top: 11px;
}
.hop-v14-home .hop-h1-actions .hop-gateway__button {
  min-height: 44px;
  padding: 9px 14px;
  border-radius: 4px;
  font-size: 12px;
  gap: 12px;
  box-shadow: 0 2px 9px rgba(0,0,0,.18);
}
.hop-v14-home .hop-h1-actions .hop-gateway__button--primary {
  color: #1c3430;
  background: #f2c987;
}
.hop-v14-home .hop-h1-actions .hop-gateway__button--dark {
  background: rgba(9,35,35,.63);
  color: #fff5dd;
  border: 1px solid rgba(239,200,137,.62);
}
.hop-v14-home .hop-h1-verified {
  margin: 12px 0 0;
  font-size: 11px;
  line-height: 1.35;
}
.hop-v14-home .hop-h1-verified a {
  color: #fff2de;
  text-decoration: underline;
  text-underline-offset: 3px;
}
.hop-v14-home .hop-h1-right {
  padding-top:8px;
  width:100%;
  color:#ffffff;
  text-align:center;
  text-shadow:0 2px 8px rgba(7,25,25,.88),0 1px 22px rgba(7,25,25,.75);
}
.hop-v14-home .hop-h1-right-label {
  display: block;
  color: #3d2a1c;
  font-size: 9px;
  letter-spacing: .19em;
  font-weight: 700;
  margin: 0 0 11px;
}
.hop-v14-home .hop-h1-brand-title {
  font: normal clamp(2.35rem,3.8vw,3.4rem)/1.09 Georgia,"Times New Roman",serif;
  letter-spacing: -.046em;
  white-space: nowrap;
  margin: 0 0 6px;
}
.hop-v14-home .hop-h1-brand-tagline {
  font: normal 12px/1.3 Georgia,serif;
  letter-spacing: .15em;
  white-space: nowrap;
  margin: 0 0 3px;
}
.hop-v14-home .hop-h1-brand-rule {
  color:#ffffff;
  margin: 8px auto 5px;
  width: 78%;
  display: flex;
  align-items: center;
  gap: 10px;
  justify-content: center;
}
.hop-v14-home .hop-h1-brand-rule::before,
.hop-v14-home .hop-h1-brand-rule::after {
  content: "";
  display: block;
  background:rgba(255,255,255,.85);
  height:1px;
  flex:1;
}
.hop-v14-home .hop-h1-brand-qualifier {
  color: #38241b;
  margin: 0 auto;
  font-size: 10px;
  max-width: 310px;
  line-height: 1.34;
}
.hop-v14-home .hop-h1-photo-credit {
  position: absolute;
  z-index: 3;
  bottom: 13px;
  left: max(calc((100vw - 1100px)/2), 32px);
  margin: 0;
  color: #fff6e5;
  font-size: 10px;
  line-height: 1.4;
  text-shadow: 0 1px 7px rgba(0,0,0,.82);
  max-width: 690px;
}
.hop-v14-home .hop-h1-photo-credit a {
  text-decoration: underline;
  color: #fff2d8;
}
@media(max-width: 1250px) {
  .hop-v14-home .hop-h1-stage {
    gap: 40px;
    grid-template-columns: minmax(0, 1.05fr) minmax(0,1fr);
  }
  .hop-v14-home .hop-h1-brand-title { font-size: clamp(2rem,3.2vw,2.7rem); }
  .hop-v14-home .hop-h1-brand-tagline { font-size: 10px; }
  .hop-v14-site .hop-v12-navband .hop-v12-nav { width: min(1100px, calc(100% - 64px)); }
}
@media(max-width: 1024px) {
  .hop-v14-home .hop-h1-stage { min-height: 540px; }
  .hop-v14-home .hop-h1-photo-hero { min-height: 540px; }
  .hop-v14-home .hop-h1-brand-title { white-space: normal; }
  .hop-v14-home .hop-h1-right { padding-top: 45px; }
  .hop-v14-home .hop-h1-left h1 { font-size: 41px; }
}
@media(max-width: 760px) {
  .hop-v14-site .hop-v12-navband .hop-v12-nav {
    width: min(100% - 36px, 1100px);
    grid-template-columns: minmax(0,1fr) auto;
    grid-template-rows: minmax(44px,auto) minmax(44px,auto);
    grid-template-areas: "identity portal" "pages pages";
    gap: 9px;
    padding: 10px 0;
  }
  .hop-v14-site .hop-v12-brandmark { width:40px; height:40px; flex-basis:40px; }
  .hop-v14-site .hop-h1-navtype .hop-v13-signature--nav { font-size: 19px; }
  .hop-v14-site .hop-h1-navtagline { font-size: 7px; letter-spacing:.05em; }
  .hop-v14-site .hop-v12-navband .hop-v12-portal { font-size:.76rem; padding:7px 0; }
  .hop-v14-home .hop-h1-stage {
    display: block;
    min-height: 0;
    width: calc(100% - 36px);
    padding: 40px 0 98px;
  }
  .hop-v14-home .hop-h1-photo-hero { min-height:0; }
  .hop-v14-home .hop-h1-photo { object-position:center 59%; }
  .hop-v14-home .hop-h1-vignette {
    background: linear-gradient(180deg,rgba(3,22,24,.80),rgba(4,25,28,.60) 63%,rgba(4,25,28,.72));
  }
  .hop-v14-home .hop-h1-left h1 { font-size:clamp(2.6rem, 9vw, 4.1rem); }
  .hop-v14-home .hop-h1-left h2 { font-size: clamp(1.45rem,5.7vw,2.1rem); }
  .hop-v14-home .hop-h1-left p:not(.hop-h1-verified) { font-size:13px;line-height:1.5; }
  .hop-v14-home .hop-h1-right {
    margin-top: 30px;
    padding: 12px 0 0;
    border-top:1px solid rgba(255,223,181,.58);
    color:#ffeed4;
    text-align:left;
    text-shadow:0 1px 5px #162828;
  }
  .hop-v14-home .hop-h1-right-label,.hop-v14-home .hop-h1-brand-title,
  .hop-v14-home .hop-h1-brand-tagline,.hop-v14-home .hop-h1-brand-rule,.hop-v14-home .hop-h1-brand-qualifier {
    color: #fff0da;
  }
  .hop-v14-home .hop-h1-brand-title { font-size:clamp(2rem,8vw,3rem); }
  .hop-v14-home .hop-h1-brand-rule { width:100%; }
  .hop-v14-home .hop-h1-photo-credit { left:18px;right:18px;font-size:9px;bottom:11px; }
}
@media(max-width:400px) {
  .hop-v14-home .hop-h1-actions { flex-direction: column; }
  .hop-v14-home .hop-h1-actions .hop-gateway__button { justify-content:space-between;width:100%; }
  .hop-v14-site .hop-h1-navtype .hop-v13-signature--nav { font-size:17px; }
}


/* H1 desktop calibration: align more closely with 1536px reference geometry. */
@media (min-width: 1251px) {
  .hop-v14-home .hop-h1-photo-hero { min-height:0; height:clamp(270px,34vw,485px); }
  .hop-v14-home .hop-h1-photo {object-position:50% 100%;}
  .hop-v14-home .hop-h1-left {top:clamp(156px,11.65vw,179px);}
  .hop-v14-home .hop-h1-stage {
    width: min(1186px, calc(100% - 64px));
    grid-template-columns: minmax(0,475px) minmax(0,1fr);
    gap: clamp(155px,19vw,290px);
    padding-top: 76px;
    padding-bottom: 34px;
  }
  .hop-v14-home .hop-h1-right {
    padding-top: 0;
    transform: translateY(-24px);
  }
  .hop-v14-home .hop-h1-photo-credit {
    left: max(calc((100vw - 1186px)/2),32px);
  }
}

/* H1 handwritten benchmark refinement, system fonts only. */
.hop-v14-home .hop-h1-left h2 {font-family:'Segoe Script','Brush Script MT',cursive; font-size:22px; font-style:normal; letter-spacing:-.045em; line-height:1.23;}
@media(max-width:760px){.hop-v14-home .hop-h1-left h2 {font-size:19px;}}

/* H1 right-brand contrast calibration over the real darker sunset source. */
@media(min-width:761px){
  .hop-v14-home .hop-h1-right{position:relative;isolation:isolate;}
  .hop-v14-home .hop-h1-right::before{content:none;display:none;}
}

/* H1 navbar identity refinement, 16 October 2026: reference typography and clean links. */
.hop-v14-site .hop-v12-navband a,
.hop-v14-site .hop-v12-navband a:hover,
.hop-v14-site .hop-v12-navband a:focus-visible {
  text-decoration: none;
}
.hop-v14-site .hop-h1-navtype {
  gap: 8px;
}
.hop-v14-site .hop-h1-navtagline {
  font-family: system-ui, -apple-system, 'Segoe UI', Arial, sans-serif;
  font-size: 10.5px;
  font-weight: 600;
  line-height: 1.25;
  letter-spacing: .16em;
}
@media (max-width: 760px) {
  .hop-v14-site .hop-h1-navtype { gap: 6px; }
  .hop-v14-site .hop-h1-navtagline {
    font-size: 7px;
    letter-spacing: .05em;
  }
}

/* Keep the full family tagline clear of the archive doorway at 320–370 px. */
@media (max-width: 370px) {
  .hop-v14-site .hop-h1-navtagline { font-size: 6px; letter-spacing: .02em; }
}

/* H1-03 | Owner-requested hero welcome only; the navbar and right brand are unchanged. */
.hop-v14-home .hop-h1-left h2 {
  font-family: 'Segoe Script', 'Brush Script MT', cursive;
  font-size: clamp(1.55rem, 2.05vw, 1.95rem);
  font-style: normal;
  font-weight: 400;
  letter-spacing: -.05em;
  line-height: 1.3;
  margin: 6px 0 18px;
  color: #fff5e7;
}
.hop-v14-home .hop-h1-left p.hop-h1-welcome {
  max-width: 435px;
  margin: 0 0 18px;
  font-size: 15.5px;
  line-height: 1.55;
  color: #fff5e6;
}
.hop-v14-home .hop-h1-actions {
  margin-top: 0;
}
.hop-v14-home .hop-h1-actions .hop-gateway__button--primary {
  min-height: 46px;
  padding: 10px 18px;
  font-size: 13px;
  gap: 15px;
}
@media (max-width: 760px) {
  .hop-v14-home .hop-h1-left h2 {
    font-size: clamp(1.35rem, 5.7vw, 1.8rem);
    margin: 6px 0 16px;
  }
  .hop-v14-home .hop-h1-left p.hop-h1-welcome {
    font-size: 14.5px;
    line-height: 1.52;
  }
}

/* Keep the complete handwritten welcome on one desktop line, as in the reference. */
@media (min-width: 1025px) {
  .hop-v14-home .hop-h1-left h2 {
    font-size: 27px;
    letter-spacing: -.075em;
    white-space: nowrap;
  }
}

/* H1 canoe sunset and fine-script update | local owner-directed hero only */
.hop-v14-home .hop-h1-photo {
  transform: none;
  object-position: center bottom;
}
.hop-v14-home .hop-h1-vignette {
  background: linear-gradient(90deg,
    rgba(2, 14, 17, .74) 0%,
    rgba(2, 14, 17, .64) 19%,
    rgba(3, 21, 23, .31) 42%,
    rgba(4, 23, 24, .09) 60%,
    rgba(3, 20, 23, 0) 83%);
}
.hop-v14-home .hop-h1-left h2 {
  font-family: 'Edwardian Script ITC', 'Palace Script MT', 'Monotype Corsiva', cursive;
  font-size: 47px;
  font-weight: 400;
  font-style: normal;
  letter-spacing: .006em;
  line-height: 1.05;
  margin: 3px 0 17px;
  white-space: nowrap;
  color: #fff7e9;
  text-shadow: 0 2px 8px rgba(0,0,0,.5);
}
@media (max-width: 1024px) {
  .hop-v14-home .hop-h1-left h2 {
    font-size: clamp(31px, 4.3vw, 43px);
    line-height: 1.07;
    white-space: normal;
  }
}
@media (max-width: 760px) {
  .hop-v14-home .hop-h1-vignette {
    background: linear-gradient(180deg,
      rgba(1,15,17,.78),
      rgba(3,21,24,.6) 48%,
      rgba(4,20,23,.67) 100%);
  }
  .hop-v14-home .hop-h1-left h2 {
    font-size: clamp(30px, 7.9vw, 40px);
    line-height: 1.1;
  }
}

/* H1 final fine-script selection: legible, restrained Monotype Corsiva. */
.hop-v14-home .hop-h1-left h2 {
  font-family: 'Monotype Corsiva', 'Edwardian Script ITC', cursive;
  font-size: 37px;
  font-weight: 400;
  font-style: normal;
  line-height: 1.08;
  letter-spacing: .002em;
  white-space: nowrap;
}
@media (max-width: 1024px) {
  .hop-v14-home .hop-h1-left h2 {
    font-size: clamp(29px, 4.1vw, 36px);
    line-height: 1.12;
    white-space: normal;
  }
}
@media (max-width: 760px) {
  .hop-v14-home .hop-h1-left h2 {
    font-size: clamp(29px, 8.1vw, 34px);
  }
}

/* H1 focused refinement: 3-line welcome, clear sail at smaller widths, softer CTA. */
.hop-v14-home .hop-h1-left p.hop-h1-welcome {
  max-width: 475px;
}
.hop-v14-home .hop-h1-actions .hop-gateway__button--primary {
  padding: 7px 13px;
  min-height: 44px;
  border-radius: 9px;
  gap: 12px;
}
@media (min-width: 761px) and (max-width: 1100px) {
  /* Place the separate verified-family label in clear sky right of the sail. */
  .hop-v14-home .hop-h1-stage { position: relative; }
  .hop-v14-home .hop-h1-right {
    position: absolute;
    top: 43px;
    right: 0;
    width: clamp(222px, 30vw, 305px);
    padding-top: 0;
    transform: none;
  }
  .hop-v14-home .hop-h1-brand-title {
    font-size: clamp(1.45rem, 2.7vw, 2.2rem);
    white-space: normal;
  }
  .hop-v14-home .hop-h1-brand-tagline {
    font-size: 9px;
    letter-spacing: .075em;
    white-space: normal;
  }
  .hop-v14-home .hop-h1-right-label { font-size: 8px; }
  .hop-v14-home .hop-h1-brand-qualifier { font-size: 10px; }
}
@media (max-width: 760px) {
  .hop-v14-home .hop-h1-desktop-break { display: none; }
  /* Keep the vessel visible, then give the separate experience its own
     opaque dark-lagoon band instead of printing its name over the sail. */
  .hop-v14-home .hop-h1-photo {
    display:block;
    inset:0 0 auto;
    width:100%;
    height:var(--hop-mobile-scene-height);
    object-fit:cover;
    object-position:0% 54%;
    transform:none;
  }
  .hop-v14-home .hop-h1-stage { padding-bottom: 0; }
  .hop-v14-home .hop-h1-right {
    position: relative;
    isolation: isolate;
    margin-top: 200px;
    padding: 22px 0 28px;
    border-top: 1px solid rgba(242,207,146,.52);
    background: #082b2f;
    text-shadow: none;
  }
  .hop-v14-home .hop-h1-right::before {
    content: "";
    position: absolute;
    left: -18px;
    right: -18px;
    top: -1px;
    bottom: 0;
    z-index: -1;
    background: #082b2f;
  }
  .hop-v14-home .hop-h1-right-label,
  .hop-v14-home .hop-h1-brand-title,
  .hop-v14-home .hop-h1-brand-tagline,
  .hop-v14-home .hop-h1-brand-rule,
  .hop-v14-home .hop-h1-brand-qualifier {color:#ffffff;}
  .hop-v14-home .hop-h1-brand-qualifier { text-align: left; margin-left: 0; }
}

/* H1 owner review: thin script, discreet navbar line, transparent CTA, contained scenic mobile composition. */
.hop-v14-home .hop-h1-left h2 {
  font-family: 'Kunstler Script', 'Monotype Corsiva', cursive;
  font-size: clamp(39px, 3.1vw, 44px);
  font-weight: 400;
  letter-spacing: .01em;
  text-shadow: 0 1px 5px rgba(0,0,0,.33);
}
.hop-v14-site .hop-h1-navtagline {
  font-weight: 400;
  font-size: 10px;
  letter-spacing: .19em;
  color: rgba(238, 232, 218, .83);
}
.hop-v14-home .hop-h1-actions .hop-gateway__button--primary {
  background: rgba(7,31,32,.18);
  border: 1px solid rgba(246,224,188,.83);
  color: #fff7e8;
  box-shadow: none;
  border-radius: 9px;
  backdrop-filter: none;
}
.hop-v14-home .hop-h1-actions .hop-gateway__button--primary:hover {
  background: rgba(7,31,32,.38);
  color: #fff9ed;
  border-color: #fff1cf;
}
@media (min-width: 761px) and (max-width: 1024px) {
  .hop-v14-home .hop-h1-photo-hero {
    background:#193534;
    overflow:hidden;
  }
  /* Keep the whole landscape in a left-anchored, scaled layer.
     The two people on its far left and the canoe at centre remain visible. */
  .hop-v14-home .hop-h1-photo {
    display:block;
    inset:auto 0 0;
    width:100%;
    height:auto;
    max-height:none;
    object-fit:contain;
    object-position:center bottom;
    transform:none;
    z-index:0;
  }
  .hop-v14-home .hop-h1-vignette {
    background: linear-gradient(180deg,
      rgba(3,20,22,.70) 0%,
      rgba(3,23,25,.48) 43%,
      rgba(3,23,25,.08) 82%,
      rgba(3,23,25,.08) 100%);
  }
  .hop-v14-home .hop-h1-stage {
    position: relative;
    display: flex;
    flex-direction: column;
    align-items: stretch;
    gap: 0;
    min-height: 0;
    padding: 39px 0 clamp(245px,29vw,335px);
  }
  .hop-v14-home .hop-h1-left {
    max-width: 510px;
  }
  .hop-v14-home .hop-h1-left h2 {
    font-size: clamp(35px,4.7vw,42px);
    white-space: normal;
  }
  .hop-v14-home .hop-h1-right {
    position:absolute;
    top:16px;right:0;
    width:min(52%,495px);
    margin:0;padding:0;
    transform:none;border:none;background:transparent;
    color:#ffffff;text-align:center;
    text-shadow:0 2px 8px rgba(7,25,25,.88),0 1px 22px rgba(7,25,25,.75);
  }
  .hop-v14-home .hop-h1-right::before {
    content: none;
    display: none;
  }
  .hop-v14-home .hop-h1-brand-title {
    color:#ffffff;
    font-size:clamp(1.8rem,3.5vw,2.8rem);
    white-space:normal;
  }
  .hop-v14-home .hop-h1-brand-tagline {
    color:#ffffff;
    font-size:10px;
    letter-spacing: .12em;
  }
  .hop-v14-home .hop-h1-brand-rule {
    color:#ffffff;
    margin:12px auto 0;
    width: min(70%, 330px);
  }
  .hop-v14-home .hop-h1-brand-rule::before,
  .hop-v14-home .hop-h1-brand-rule::after {
    background:rgba(255,255,255,.85);
  }
}
@media (max-width: 760px) {
  .hop-v14-home .hop-h1-photo-hero {
    --hop-mobile-scene-height:clamp(248px,61vw,360px);
    --hop-mobile-wave-height:clamp(82px,23vw,122px);
    height:var(--hop-mobile-scene-height);
    min-height:0;
    background:#fbf6ee;
  }
  .hop-v14-home .hop-h1-left {
    top:clamp(94px,19vw,128px);
    left:50%;right:auto;
    width:calc(100% - 26px);
    max-width:none;
    transform:translateX(-50%);
    color:#ffffff;
    text-align:center;
    text-shadow:0 2px 6px rgba(3,22,23,.9);
  }
  .hop-v14-home .hop-h1-left p.hop-h1-welcome {
    max-width:100%;
    margin:0;
    color:#ffffff;
    font-size:clamp(10px,3vw,12px);
    line-height:1.5;
  }
  .hop-v14-home .hop-h1-actions {display:none;}
  .hop-v14-home .hop-h1-actions .hop-gateway__button--primary {
    width:auto;
    min-height:45px;
    min-width:0;
    max-width:100%;
    padding:8px 14px;
    gap:22px;
    color:#24564b;
    background:rgba(221,237,226,.8);
    border:1px solid #709b8d;
    box-shadow:none;
  }
  .hop-v14-home .hop-h1-actions .hop-gateway__button--primary:hover {
    color:#123d35;
    background:#d5eadc;
    border-color:#336d60;
  }
  .hop-v14-home .hop-h1-right {
    position:absolute;top:14px;right:0;
    width:min(75%,300px);
    margin:0;padding:0;background:transparent;
    border:none;text-align:center;
  }
  .hop-v14-home .hop-h1-right::before { content: none; display: none; }
  .hop-v14-home .hop-h1-brand-title {
    font-size:clamp(1.1rem,5.3vw,1.95rem);
  }
  .hop-v14-home .hop-h1-brand-tagline {
    font-size:clamp(6px,1.5vw,9px);
    letter-spacing:.08em;
  }
  .hop-v14-home .hop-h1-left h2 {font-size: clamp(33px,8.1vw,39px);}
  .hop-v14-site .hop-h1-navtagline {
    font-weight: 400;
    font-size: 7px;
    letter-spacing: .04em;
  }
  .hop-v14-home .hop-h1-vignette {
    inset:0 0 auto;
    height:var(--hop-mobile-scene-height);
    background:linear-gradient(180deg,
      rgba(3,20,22,.62) 0%,
      rgba(3,20,22,.26) 50%,
      rgba(3,20,22,0) 100%);
  }
}
@media (max-width: 370px) {
  .hop-v14-site .hop-h1-navtagline {font-size: 6px; letter-spacing:.015em;}
}

/* H1 responsive scenic continuity: same original photograph at intermediate widths.
   Keep the horizon panorama whole rather than switching to a cropped duplicate layer. */
@media (min-width:761px) and (max-width:1250px) {
  .hop-v14-home .hop-h1-photo-hero {background:#213a37;}
  .hop-v14-home .hop-h1-photo {
    display:block;
    inset:0;
    width:100%;
    height:100%;
    object-fit:cover;
    object-position:50% 54%;
    transform:none;
  }
  .hop-v14-home .hop-h1-photo-hero {
    min-height:clamp(430px,42vw,500px);
  }
  .hop-v14-home .hop-h1-vignette {
    background:linear-gradient(180deg,rgba(2,20,23,.74),rgba(2,20,23,.46) 45%,rgba(2,20,23,.13) 100%);
  }
  .hop-v14-home .hop-v11-letter-grid > div {transform:none;}
}
/* Desktop Home image matches all three supporting hero panels. Bottom focal
   anchor discards sky before shoreline, people and sailing boat. Tablet stays
   at its existing safe height for readable in-photo copy and CTA. */
@media (min-width:1025px) and (max-width:1250px) {
  .hop-v14-home .hop-h1-photo-hero {
    min-height:0;
    height:clamp(270px,34vw,485px);
  }
  .hop-v14-home .hop-h1-photo {object-position:50% 100%;}
}


/* H1 refinement: matching navbar and hero taglines; rounder compact CTA. */
.hop-v14-site .hop-h1-navtagline,
.hop-v14-home .hop-h1-brand-tagline {
  font-family: Georgia, serif;
  font-weight: 400;
  font-style: normal;
  line-height: 1.3;
}
.hop-v14-site .hop-h1-navtagline {
  font-size: 10px;
  letter-spacing: .15em;
}
.hop-v14-home .hop-h1-actions .hop-gateway__button--primary {
  padding: 5px 10px;
  gap: 9px;
  border-radius: 15px;
  min-height: 44px;
}
@media (min-width: 761px) and (max-width: 1024px) {
  .hop-v14-site .hop-h1-navtagline { letter-spacing: .12em; }
}
@media (max-width: 760px) {
  .hop-v14-site .hop-h1-navtagline { font-size: 7px; letter-spacing: .08em; }
}
@media (max-width: 370px) {
  .hop-v14-site .hop-h1-navtagline { font-size: 6px; letter-spacing: .04em; }
}

/* Keep the longer Our People/Places/Stories script entirely in its desktop column. */
@media (min-width: 1025px) {
  .hop-v14-home .hop-h1-left h2 {
    font-size: clamp(39px, 3.1vw, 42px);
  }
}


/* H1 home-to-welcome curved wave and Talofa section */
.hop-v14-home .hop-h1-photo-hero {position:relative;}
.hop-v14-home .hop-h1-wave {
  position:absolute;
  z-index:4;
  left:0;right:0;bottom:-1px;
  height:clamp(95px,11vw,170px);
  pointer-events:none;
  line-height:0;
}
.hop-v14-home .hop-h1-wave svg {display:block;width:100%;height:100%;}
.hop-v14-home .hop-h1-wave path {fill:#fbf6ee;}
.hop-v14-home .hop-v11-letter {
  background:#fbf6ee;
  overflow:visible;
  padding:clamp(25px,3vw,45px) 0 92px;
}
.hop-v14-home .hop-v11-letter-grid {
  display:grid;
  grid-template-columns:minmax(0,1.2fr) minmax(0,.92fr);
  gap:clamp(26px,4vw,64px);
  align-items:start;
  max-width:1200px;
  margin:calc(-1 * clamp(68px,7vw,100px)) auto 0;
}
.hop-v14-home .hop-v11-letter-grid > div {
  max-width:650px;
  transform:none;
}
/* The owner-supplied flower is a quiet, non-interactive welcome motif. */
.hop-v14-home .hop-h1-floral-motif {
  min-width:0;
  width:100%;
  max-width:455px;
  justify-self:center;
  align-self:center;
  margin:0;
  pointer-events:none;
}
.hop-v14-home .hop-h1-floral-motif img {
  display:block;
  width:100%;
  height:auto;
  aspect-ratio:1;
  object-fit:contain;
  opacity:.56;
}
@media (max-width:900px) {
  .hop-v14-home .hop-v11-letter-grid {
    grid-template-columns:minmax(0,1fr);
    gap:clamp(25px,5vw,42px);
    margin-top:var(--hop-home-editorial-lift,calc(-1 * clamp(68px,7vw,100px)));
  }
  .hop-v14-home .hop-v11-letter-grid > div {transform:none;}
  .hop-v14-home .hop-h1-floral-motif {max-width:320px;}
  .hop-v14-home .hop-h1-floral-motif img {opacity:.45;}
}
@media (max-width:420px) {
  .hop-v14-home .hop-h1-floral-motif {max-width:260px;}
  .hop-v14-home .hop-v11-letter {--hop-letter-eyebrow-size:.65rem;}
}
.hop-v14-home .hop-v11-letter .hop-h1-letter-eyebrow {
  color:#97683f;
  font-size:var(--hop-letter-eyebrow-size,.74rem);
  font-weight:700;
  letter-spacing:.2em;
  line-height:1.5;
  margin:0 0 14px;
  text-shadow:none;
}
.hop-v14-home .hop-v11-letter h2#letter-title {
  font:normal clamp(2.8rem,5vw,5.2rem)/1.08 Georgia,'Times New Roman',serif;
  letter-spacing:-.043em;
  margin:0 0 18px;
  color:#2d3330;
}
.hop-v14-home .hop-v11-letter h2#letter-title em {
  display:block;
  font-style:italic;
  font-weight:400;
  color:#b77d56;
}
.hop-v14-home .hop-v11-letter-grid > div > p:not(.hop-h1-letter-eyebrow):not(.hop-v11-signature) {
  color:#514d47;
  font-size:clamp(1rem,1.45vw,1.2rem);
  line-height:1.7;
  margin:0 0 16px;
  max-width:790px;
}
@media (max-width:760px){
  .hop-v14-home .hop-h1-wave {
    height:var(--hop-mobile-wave-height);
    top:calc(var(--hop-mobile-scene-height) - var(--hop-mobile-wave-height));
    bottom:auto;
  }
  .hop-v14-home .hop-v11-letter {
    padding:22px 0 58px;
    --hop-home-editorial-lift:calc(-.65 * clamp(82px,23vw,122px));
  }
  .hop-v14-home .hop-v11-letter h2#letter-title {font-size:clamp(2.45rem,9vw,3.8rem);}
}


/* Gateway-specific facility identity; keep the Pereira's of the Pacific scenic signature separate. */
.hop-v14-site .hop-h1-navtagline {
  font-family:system-ui,-apple-system,"Segoe UI",Arial,sans-serif;
  font-weight:700;
  letter-spacing:.14em;
  color:#f0c782;
}
@media (max-width:760px) {
  .hop-v14-site .hop-h1-navtagline {font-size:9px;letter-spacing:.12em;}
}
@media (max-width:370px) {
  .hop-v14-site .hop-h1-navtagline {font-size:8px;letter-spacing:.1em;}
}
/* The short word "to" must not become an orphan in the About Us mobile heading. */
@media (max-width:480px) {
  .hop-v14-about .hop-v14-page-stage #content-title {text-wrap:balance;}
}
