/* Shared finishing details. All motion is brief and respects the system preference. */
[hidden] { display: none !important; }
main:focus { outline: none; }
main { scroll-margin-top: var(--masthead-h); }
.page-progress { position: absolute; inset: auto 0 -1px; height: 2px; overflow: hidden; pointer-events: none; }
.page-progress > span { display: block; width: 100%; height: 100%; transform: scaleX(var(--reading-progress,0)); transform-origin: left; background: #6b9b81; }
.home-page:not(.header-solid) .page-progress > span { background: #cce2bb; }
.back-top { position: fixed; bottom: 1.5rem; right: 1.5rem; z-index: 900; display: flex; gap: .7rem; align-items: center; justify-content: center; min-width: 48px; min-height: 48px; padding: .65rem 1rem; border-radius: 100px; background: #f7f8f3f5; color: #173f3d; border: 1px solid #6b8a7840; text-decoration: none; box-shadow: 0 4px 22px #082f3515; backdrop-filter: blur(12px); }
.back-top > span:first-child { font-size: 1.3rem; line-height: 1; }
.back-top > span:last-child { font-size: .65rem; }
.back-top:hover { background: #e3eedd; }
.contents a { min-height: 36px; display: inline-flex; align-items: center; gap: 1rem; text-underline-offset: 5px; }
.contents a:hover { color: var(--accent); }
.nav__link { position: relative; }
.nav__link::after { transition: width .25s ease, opacity .25s; }
.brand__mark { transition: transform .3s; }
.brand:hover .brand__mark { transform: rotate(-6deg); }
.feature-card__copy { position: static; }
.feature-card__link { display: block; height: 100%; text-decoration: none; color: inherit; }
.feature-card__arrow { position: absolute; bottom: 1.1rem; right: 1.1rem; width: 38px; height: 38px; border: 1px solid var(--line); border-radius: 50%; display: grid; place-items: center; }
.feature-card--camera .feature-card__arrow { border-color: #ffffff50; }
.feature-card { transition: box-shadow .3s, border-color .3s; }
.feature-card:has(a:hover), .feature-card:focus-within { border-color: #64897770; box-shadow: 0 18px 30px -16px #163f3530; }
.feature-card:has(a:focus-visible) { outline: 2px solid var(--accent); outline-offset: 4px; }
.feature-card__link:focus-visible { outline: none; }
.feature-card__copy { padding-bottom: 4.2rem; }
.feature-card__copy p { padding-right: 0; }
.feature-card__arrow { transition: transform .25s; }
.feature-card:has(a:hover) .feature-card__arrow { transform: translate(2px,-2px); }
.camera-art, .conditions-art, .awareness-art { transition: transform .5s cubic-bezier(.2,.65,.3,1); }
.feature-card:has(a:hover) .camera-art, .feature-card:has(a:hover) .conditions-art, .feature-card:has(a:hover) .awareness-art { transform: translateY(-4px); }
.coast-visual img, .safety-hero__photo img, .origin-scene > img { transition: transform .7s cubic-bezier(.2,.65,.3,1); }
@media (hover: hover) and (prefers-reduced-motion: no-preference) {
  .coast-visual:hover img, .safety-hero__photo:hover img { transform: scale(1.035); }
}
.faq summary { min-height: 64px; transition: color .2s; }
.faq summary::after { border: 1px solid var(--line); border-radius: 50%; width: 30px; height: 30px; display: grid; place-items: center; }
.faq[open] { background: #eaf0e840; }
.editorial-detail summary { transition: background .2s; }
.editorial-detail summary:hover { background: #91b2960c; }
.faq[open] .faq__body, .editorial-detail[open] .detail-body, .tool-card[open] .tool-card__body { animation: disclosure-entry .3s ease both; }
@keyframes disclosure-entry { from { opacity: .4; transform: translateY(-5px); } to { opacity: 1; transform: translateY(0); } }
@media (prefers-reduced-motion: no-preference) {
  .inner-page .page-head .label, .inner-page .page-head h1, .inner-page .page-head .lead, .how-hero__copy, .safety-hero__copy, .about-hero__copy { animation: page-entry .8s cubic-bezier(.2,.65,.3,1) both; }
  .inner-page .page-head h1 { animation-delay: .06s; }
  .inner-page .page-head .lead { animation-delay: .12s; }
}
@keyframes page-entry { from { opacity: .2; transform: translateY(18px); } to { opacity: 1; transform: translateY(0); } }

/* Coverage is a small beach explorer: search, filter and select. */
.page-coverage .h2 em { color: #628377; font-weight: 450; }
.coast-shortcuts { display: flex; flex-wrap: wrap; align-items: center; gap: .6rem; margin-bottom: 1.6rem; }
.coast-shortcuts > .label { font-size: .55rem; margin-right: 1rem; }
.coast-shortcuts button, .coast-shortcuts > a { display: inline-flex; align-items: center; gap: 1rem; background: transparent; border: 1px solid var(--line); border-radius: 100px; padding: .75rem 1rem; font: inherit; font-size: .75rem; text-decoration: none; color: var(--ink); cursor: pointer; min-height: 44px; transition: background .2s, border-color .2s; }
.coast-shortcuts button:hover, .coast-shortcuts button[aria-pressed="true"] { background: #e3ecdf; border-color: #748f7c; }
.coast-shortcuts button:disabled { opacity: .45; cursor: default; }
.coast-shortcuts > a { border-color: transparent; margin-left: auto; }
.coast-shortcuts > a:hover { background: #eaf0e8; }
.map__canvas-wrap { overflow: hidden; border-radius: 14px; border: 1px solid var(--line); }
.inner-page .map__canvas { border: 0; border-radius: 0; }
.map__legend { border: 0; border-top: 1px solid var(--line); }
.map__side { position: static; }
.map__panel { background: #edf2e9; border-color: #64867140; padding: 1.7rem; }
.map__panel-name { font-weight: 450; }
.map__stats { gap: 1.5rem; margin-block: 1.5rem; }
.map__stat-value { font-size: 1.55rem; font-weight: 450; margin-top: .4rem; }
.beach-filters { display: grid; grid-template-columns: minmax(0,1.6fr) minmax(0,1fr) auto; gap: 1.5rem; align-items: end; padding: 1.5rem; background: #f8faf5; border: 1px solid var(--line); border-radius: 12px; }
.beach-filters label { display: block; font-size: .65rem; font-weight: 550; margin-bottom: .65rem; }
.beach-search > div { position: relative; }
.beach-search svg { position: absolute; width: 18px; height: 18px; top: 50%; left: 1rem; transform: translateY(-50%); pointer-events: none; color: #658373; }
.beach-filters input, .beach-filters select { width: 100%; height: 52px; border: 1px solid #68836f50; border-radius: 6px; font: inherit; font-size: .85rem; color: var(--ink); background: #fdfefb; }
.beach-filters input { padding: .9rem 1rem .9rem 2.7rem; }
.beach-filters select { padding: .9rem 2rem .9rem 1rem; }
.beach-filters input::placeholder { color: #6c8077; }
.filter-reset { min-height: 52px; border: 0; padding: .75rem .5rem; cursor: pointer; color: var(--ink); font: inherit; font-size: .75rem; background: transparent; display: flex; align-items: center; gap: 1rem; }
.filter-reset:hover:not(:disabled) { text-decoration: underline; text-underline-offset: 5px; }
.filter-reset:disabled { opacity: .4; cursor: default; }
.beach-count { font-size: .7rem; color: var(--ink-2); padding-block: 1.25rem; }
.beach-empty { padding: 3rem 1.5rem; text-align: center; border: 1px dashed #6d8d7855; border-radius: 12px; margin-bottom: 2rem; }
.beach-empty > span { display: block; font-size: 3rem; line-height: 1; color: #6a8975; }
.beach-empty h3 { font-family: var(--font-serif); font-size: 2rem; font-weight: 450; margin-top: 1rem; }
.beach-empty p { color: var(--ink-2); font-size: .85rem; margin-top: .65rem; }
.page-coverage .table tr[data-id]:hover th, .page-coverage .table tr[data-id]:hover td { background: #f7f9f2; }
.page-coverage .table tr.is-highlight th, .page-coverage .table tr.is-highlight td { box-shadow: none; background: #e0ebdc; }
.page-coverage .table tr.is-highlight th { box-shadow: inset 3px 0 #6b8b66; }
.page-coverage .table th[scope="row"] { padding-left: .75rem; }
.page-coverage .table .btn { min-height: 44px; }

/* Secondary pages share the same editorial detail and real app imagery. */
.inner-page .launch-card { padding: 0; overflow: hidden; align-self: start; }
.launch-card > [data-auth-state] { padding: 2rem; }
.launch-preview { display: block; color: var(--ink); text-decoration: none; background: #e5ecdf; }
.launch-preview__scene { height: 270px; position: relative; overflow: hidden; background: #183e42; }
.launch-preview__scene > img { width: 100%; height: 100%; object-fit: cover; filter: brightness(.8); }
.launch-preview__phone { position: absolute; width: 150px; bottom: -95px; left: calc(50% - 75px); padding: 5px; background: #121b22; border: 1px solid #82958d; border-radius: 24px; box-shadow: 0 10px 30px #0005; transform: rotate(-9deg); transition: transform .6s cubic-bezier(.2,.65,.3,1); }
.launch-preview__phone img { width: 100%; height: auto; border-radius: 19px; }
.launch-preview:hover .launch-preview__phone, .launch-preview:focus-visible .launch-preview__phone { transform: rotate(-3deg) translateY(-14px); }
.launch-preview > span { padding: 1rem 1.5rem; display: flex; align-items: center; justify-content: space-between; font-size: .75rem; }
.launch-card .text-link { font-size: .75rem; margin-top: 1.25rem; }
.privacy-overview { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 1rem; padding-top: 2.5rem; }
.privacy-overview > a { position: relative; padding: 1.6rem; border: 1px solid var(--line); border-radius: 9px; color: var(--ink); background: #eff3ea; text-decoration: none; transition: background .25s; }
.privacy-overview > a:hover { background: #e4edde; }
.privacy-overview__number { display: block; font-size: .55rem; letter-spacing: .09em; color: #627d6a; margin-bottom: 2rem; }
.privacy-overview strong { display: block; font-family: var(--font-serif); font-size: 1.8rem; font-weight: 450; }
.privacy-overview a > span:last-of-type { display: block; font-size: .73rem; color: var(--ink-2); margin-top: .5rem; padding-right: 1.5rem; }
.privacy-overview b { position: absolute; top: 1.3rem; right: 1.6rem; font-weight: 400; }
.page-404 .page-head .h1 { font-size: clamp(4rem,7vw,7rem); }
.page-404 .page-head .lead { grid-row: 3; grid-column: 1 / 7; }
.page-404 .page-head .actions { grid-row: 4; margin-top: .5rem; }
.lost-coast { grid-column: 8 / 13; grid-row: 1 / 5; align-self: center; }
.lost-coast svg { display: block; width: 100%; height: auto; }
.lost-buoy { transform-origin: 260px 270px; transition: transform .7s; }
.lost-coast:hover .lost-buoy { transform: rotate(-8deg); }

@media (max-width: 900px) {
  .feature-card { display: block; }
  .feature-card__link { display: grid; grid-template-columns: 1fr 1fr; }
  .beach-filters { grid-template-columns: 1.3fr 1fr; gap: 1rem; }
  .filter-reset { grid-column: 1 / -1; justify-self: end; min-height: 40px; }
  .coast-shortcuts > .label { flex-basis: 100%; margin: 0 0 .3rem; }
  .coast-shortcuts > a { margin-left: 0; }
  .privacy-overview { gap: .7rem; }
  .privacy-overview > a { padding: 1.2rem; }
  .privacy-overview strong { font-size: 1.5rem; }
  .page-404 .page-head .lead { grid-column: 1 / -1; }
  .lost-coast { grid-column: 1 / -1; grid-row: 4; max-width: 400px; width: 100%; justify-self: center; }
  .page-404 .page-head .actions { grid-row: 5; }
}
@media (max-width: 640px) {
  .feature-card__link { display: block; }
  .back-top { bottom: 1rem; right: 1rem; padding: .5rem; }
  .back-top > span:last-child { display: none; }
  .coast-shortcuts { gap: .5rem; }
  .coast-shortcuts button, .coast-shortcuts > a { padding: .6rem .85rem; font-size: .68rem; gap: .7rem; }
  .map__panel { padding: 1.4rem; }
  .beach-filters { grid-template-columns: 1fr; padding: 1rem; gap: 1rem; }
  .beach-filters input, .beach-filters select { font-size: 16px; }
  .filter-reset { padding: 0; min-height: 36px; }
  .page-coverage .table { font-size: .75rem; }
  .page-coverage .table th[scope="row"] { font-size: .78rem; }
  .page-coverage .table th { font-size: .55rem; white-space: normal; }
  .page-coverage .table td, .page-coverage .table th { padding-right: .4rem; }
  .page-coverage .table .btn { font-size: .66rem; padding: .65rem .6rem; white-space: normal; }
  .page-coverage .table .pill { font-size: .52rem; padding: .2rem .4rem; }
  .page-coverage .table__act { width: 92px; }
  .page-coverage .table td:nth-child(2) { width: 70px; }
  .launch-card > [data-auth-state] { padding: 1.5rem; }
  .privacy-overview { grid-template-columns: 1fr; padding-top: 1.5rem; }
  .privacy-overview__number { margin-bottom: 1rem; }
  .privacy-overview > a { padding: 1.4rem; }
  .privacy-overview strong { font-size: 1.8rem; }
  .page-404 .page-head .h1 { font-size: 4rem; }
  .lost-coast { max-width: 280px; }
}
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation: none !important; transition: none !important; scroll-behavior: auto !important; }
  .btn:hover, .brand:hover .brand__mark, .launch-preview:hover .launch-preview__phone, .launch-preview:focus-visible .launch-preview__phone, .lost-coast:hover .lost-buoy { transform: none; }
}
@media print {
  *, *::before, *::after { animation: none !important; transition: none !important; }
  .page-progress, .back-top, .beach-filters, .beach-count, .beach-empty, .coast-shortcuts, .privacy-overview, .launch-preview, .lost-coast { display: none !important; }
  .page-coverage tbody[hidden] { display: table-row-group !important; }
  .page-coverage tr[hidden] { display: table-row !important; }
  .feature-card__arrow { display: none; }
  .map__panel, .launch-card { background: white; }
}