/* Passport homepage — passport.audio

   The approved conversion design (mockups/passport-conversion.html),
   carried over rule for rule. Only the design-preview notices were
   dropped. The compact formatting is the mockup's own and is kept on
   purpose: the later blocks override the earlier ones, so the order
   is the design.

   This file styles index.html ONLY. The other pages (/try, /download,
   /resend, /flight-log, /continuity) still use styles.css, and the two
   share class names (.hero, .section, .btn, .footer), so never load
   both on one page.
*/
:root{--paper:#f2ede1;--white:#faf7ef;--ink:#26221a;--muted:#625c4d;--rule:#c9bfa8;--amber:#efa329;--deep:#815006;--green:#315e50;--mono:'Courier Prime','Courier New',monospace;--sans:Arial,Helvetica,sans-serif}
*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:30px}body{margin:0;background:var(--paper);color:var(--ink);font:17px/1.6 var(--sans);-webkit-font-smoothing:antialiased}::selection{background:var(--amber);color:var(--ink)}a{color:inherit;text-underline-offset:5px}button,input{font:inherit}button,a,input{outline-offset:5px}a:focus-visible,button:focus-visible,input:focus-visible,summary:focus-visible{outline:2px solid var(--deep)}button{cursor:pointer}button:disabled{cursor:default}h1,h2,h3,p,figure{margin:0}h1,h2,h3{line-height:1.08;text-wrap:balance}h1,h2{font-family:var(--mono);letter-spacing:-.035em}h1{font-size:clamp(39px,4.5vw,65px);font-weight:700}h2{font-size:clamp(32px,3.3vw,46px)}h3{font-size:21px;line-height:1.25}p{max-width:68ch}.wrap{width:min(1180px,calc(100% - 80px));margin:auto}.mono{font-family:var(--mono)}.muted{color:var(--muted)}.small{font-size:13px}.skip{position:absolute;left:12px;top:-100px;background:var(--white);padding:10px;z-index:5}.skip:focus{top:12px}.offer{background:var(--ink);color:var(--white);padding:10px 20px;text-align:center;font-size:13px}.offer a{margin-left:14px;color:#f5b449;white-space:nowrap}.nav{display:flex;align-items:center;justify-content:space-between;gap:24px;padding:24px 0;border-bottom:1px solid var(--rule)}.brand{font:700 34px/1 var(--mono);letter-spacing:-2px;text-decoration:none;display:flex;align-items:center;gap:10px}.brand:before{content:'';width:11px;height:11px;border-radius:50%;background:var(--amber)}nav{display:flex;align-items:center;gap:28px;font-size:14px}nav a{text-decoration:none}nav a:hover{text-decoration:underline}.nav-buy{border:1px solid var(--ink);padding:8px 16px}.hero{display:grid;grid-template-columns:1fr 1fr;gap:52px;padding:56px 0 44px;align-items:center}.audience{font:14px/1.5 var(--mono);margin-bottom:22px;color:var(--deep);max-width:39ch}.hero h1{max-width:17ch}.hero .intro{font-size:17px;line-height:1.6;margin:22px 0 18px;max-width:48ch}.hero-points{list-style:none;margin:0 0 25px;padding:0;font-size:14px}.hero-points li{display:flex;gap:10px;margin:7px 0}.check{width:17px;height:17px;flex-shrink:0;stroke:var(--green);fill:none;stroke-width:1.8;margin-top:3px}.actions{display:flex;gap:12px;flex-wrap:wrap;align-items:center}.btn{display:inline-flex;align-items:center;justify-content:center;gap:12px;padding:14px 20px;min-height:49px;border:1px solid var(--ink);border-radius:2px;font-size:14px;font-weight:700;text-decoration:none;background:transparent;color:var(--ink);transition:background .18s,color .18s}.btn.primary{background:var(--amber);border-color:var(--amber)}.btn.primary:hover{background:#e49720;border-color:#e49720}.btn.secondary:hover{background:var(--ink);color:var(--white)}.arrow{width:17px;height:17px;fill:none;stroke:currentColor;stroke-width:1.6}.reassurance{font-size:12px;margin-top:13px;color:var(--muted)}.hero-proof{min-width:0;position:relative}.source{background:var(--white);border:1px solid var(--rule);padding:20px 24px;margin:0 20px;font-family:var(--mono);transform:rotate(-1.4deg);box-shadow:0 5px 12px #2920100a}.source-head{display:flex;justify-content:space-between;align-items:center;border-bottom:1px solid var(--rule);padding-bottom:10px;font-size:12px}.source-head strong{font-size:14px}.source table{width:100%;font-size:11px;border-collapse:collapse;line-height:1.6}.source th{text-align:left;color:var(--muted);font-weight:400;padding:10px 0 5px}.source td{padding:4px 0;border-bottom:1px solid #ded6c5}.source td:first-child{width:45px}.source td:last-child{text-align:right}.transfer{display:flex;align-items:center;gap:10px;justify-content:center;padding:19px 0 16px;font:12px var(--mono);color:var(--muted)}.transfer svg{width:16px;height:20px;stroke:var(--deep);fill:none;stroke-width:1.5}.timeline{background:#292a27;color:#f4efe1;border:1px solid #151714;border-radius:4px;box-shadow:0 14px 26px #2720161c;overflow:hidden}.timeline-bar{padding:12px 16px;border-bottom:1px solid #505148;font:12px var(--mono);display:flex;justify-content:space-between}.timeline-bar span:last-child{color:#d3c8ae;font-size:10px}.track-grid{padding:16px 13px 14px;display:grid;grid-template-columns:72px 1fr;gap:7px}.time-ruler{grid-column:2;display:flex;justify-content:space-between;font:9px var(--mono);color:#c3c0b4;padding-bottom:5px}.track-label{font:10px/1.4 var(--mono);align-self:center;color:#d9d5c9}.clips{display:grid;grid-template-columns:1.1fr 1.45fr 1fr;gap:3px;min-width:0}.clip{min-width:0;border:1px solid #b68b45;background:#735820;color:#fff4d6;font:10px/1.5 var(--mono);padding:8px 6px;text-align:left;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;border-radius:1px}.clip strong{display:block;font-size:12px}.clip.active{background:#edac46;color:#2c2518;border-color:#ffe0a1}.descriptions .clip{background:#494e41;border-color:#778469;color:#f0f2df;padding:10px 6px;font-size:9px}.shots{display:grid;grid-template-columns:repeat(10,1fr);gap:3px}.shots span{height:27px;background:#4e5d63;border:1px solid #86979f;position:relative}.shots span:after{content:'';position:absolute;left:3px;right:3px;top:8px;border-top:1px solid #a9b6bb}.timeline-bottom{border-top:1px solid #505148;padding:10px 16px;font:10px var(--mono);display:flex;justify-content:space-between;color:#cfcabb}.scene-detail{display:flex;align-items:baseline;gap:10px;font-size:12px;padding:15px 4px 0;min-height:54px}.scene-detail strong{color:var(--deep);white-space:nowrap}.caption{font:10px/1.5 var(--mono);color:var(--muted);text-align:center;margin:8px auto 0}.proof-line{display:flex;justify-content:space-between;align-items:center;gap:20px;padding:22px 0;border-top:1px solid var(--rule);border-bottom:1px solid var(--rule);font-size:13px}.proof-line strong{font-weight:400}.proof-line span{display:flex;align-items:center;gap:9px}.proof-line .dot{width:5px;height:5px;background:var(--green);display:block}.section{padding:82px 0}.section-heading{display:flex;justify-content:space-between;align-items:end;gap:40px;margin-bottom:36px}.section-heading h2{max-width:16ch}.section-heading p{max-width:40ch;color:var(--muted);font-size:15px}.workflow{display:grid;grid-template-columns:repeat(3,1fr);gap:34px}.step{border-top:1px solid var(--rule);padding-top:18px}.step-number{font:12px var(--mono);color:var(--deep);margin-bottom:17px;display:block}.step p{font-size:15px;color:var(--muted);margin:12px 0 20px}.file-label{font:11px var(--mono);border:1px solid var(--rule);padding:7px 9px;display:inline-block;background:var(--white)}.demo-section{background:#e8e1d1;border-top:1px solid var(--rule);border-bottom:1px solid var(--rule)}.demo-layout{display:grid;grid-template-columns:1.15fr .85fr;gap:54px;align-items:center}.video-shell{aspect-ratio:16/9;background:#292a27;display:flex;align-items:center;justify-content:center;position:relative;border:1px solid #46463d}.video-shell iframe{width:100%;height:100%;border:0;position:absolute;inset:0}.video-button{color:var(--white);background:none;border:0;display:flex;flex-direction:column;align-items:center;gap:18px;font-size:15px;padding:30px}.play-icon{display:flex;align-items:center;justify-content:center;width:65px;height:65px;border:1px solid #a99b7e;border-radius:50%}.play-icon svg{width:20px;height:20px;fill:var(--amber);margin-left:4px}.video-button:hover .play-icon{background:#464237}.video-note{font-size:11px;color:var(--muted);margin-top:10px}.demo-copy h2{max-width:14ch}.demo-copy p{font-size:15px;margin:20px 0 24px;color:var(--muted)}.text-link{font-size:14px;font-weight:700;color:var(--deep)}.quote{padding:40px 0 0;margin-top:38px;border-top:1px solid #bcb198;display:grid;grid-template-columns:1.15fr .85fr;gap:54px;align-items:center}.quote blockquote{font:24px/1.4 var(--mono);margin:0;max-width:34ch}.quote figcaption{font-size:12px;color:var(--muted)}.quote figcaption strong{display:block;font-size:15px;color:var(--ink);margin-bottom:4px}.quote .credits{font-size:11px;margin-top:9px;display:block}.fit{display:grid;grid-template-columns:1fr 1fr;gap:80px}.fit h2{max-width:15ch;margin-bottom:23px}.fit p{color:var(--muted);font-size:15px}.input-list{list-style:none;margin:0;padding:0}.input-list li{display:grid;grid-template-columns:120px 1fr;gap:20px;border-bottom:1px solid var(--rule);padding:18px 0;font-size:14px}.input-list li:first-child{padding-top:0}.input-list strong{font-size:13px}.fit-note{margin-top:24px;padding-top:18px;border-top:1px solid var(--rule)}.purchase{background:var(--ink);color:var(--white);padding:60px;display:grid;grid-template-columns:1fr 1fr;gap:65px}.purchase h2{font-size:45px;max-width:13ch}.purchase .lead{font-size:15px;color:#d0c7b5;margin:22px 0}.purchase .terms{font-size:12px;color:#d0c7b5;line-height:1.7}.purchase ul{padding:0;list-style:none;font-size:14px}.purchase li{padding:5px 0}.purchase li:before{content:'—';margin-right:10px;color:var(--amber)}.purchase-price{display:flex;align-items:baseline;gap:16px}.purchase-price strong{font:700 64px/1 var(--mono);letter-spacing:-4px}.purchase-price del{font:24px var(--mono);color:#c0b69f}.purchase-price span{font-size:13px;color:#d0c7b5}.price-side .btn{width:100%;margin-top:22px}.price-side .trial{color:var(--white);font-size:14px;display:block;text-align:center;margin-top:18px}.price-side .refund{font-size:12px;color:#d0c7b5;text-align:center;margin-top:12px}.price-side .terms{border-top:1px solid #615947;margin-top:22px;padding-top:18px}.faq-layout{display:grid;grid-template-columns:.75fr 1.25fr;gap:80px}.faq-layout h2{max-width:11ch}.faq-layout>div>p{font-size:14px;color:var(--muted);margin-top:22px}details{border-bottom:1px solid var(--rule)}details:first-child{border-top:1px solid var(--rule)}summary{cursor:pointer;padding:20px 25px 20px 0;font-size:15px;font-weight:700;position:relative;list-style:none}summary::-webkit-details-marker{display:none}summary:after{content:'+';position:absolute;right:2px;top:16px;font:24px var(--mono);font-weight:400;color:var(--deep)}details[open] summary:after{content:'−'}details p{font-size:14px;color:var(--muted);padding-bottom:22px;max-width:60ch}.resource{border-top:1px solid var(--rule);border-bottom:1px solid var(--rule);padding:30px 0;display:grid;grid-template-columns:1fr auto;align-items:center;gap:40px}.resource h3{font:700 22px var(--mono)}.resource p{font-size:13px;max-width:67ch;color:var(--muted);margin-top:8px}.resource a{white-space:nowrap}.newsletter{padding:25px 0;font-size:12px;color:var(--muted)}.newsletter a{margin-left:6px}.footer{display:flex;justify-content:space-between;align-items:center;padding:34px 0 24px;border-top:1px solid var(--rule);font-size:12px;gap:24px}.footer .brand{font-size:25px}.footer-links{display:flex;gap:24px;flex-wrap:wrap}
@media(min-width:1500px){.hero{padding-top:72px;padding-bottom:64px}}@media(max-width:1050px){.wrap{width:calc(100% - 48px)}.hero{gap:28px}.hero h1{font-size:49px}.hero .intro{font-size:16px}.hero .actions{gap:9px}.hero .btn{padding:12px 14px;font-size:13px}.track-grid{grid-template-columns:58px 1fr}.clip{font-size:8px}.source{margin:0 8px;padding:16px}.demo-layout,.quote{gap:32px}.purchase{padding:40px;gap:40px}.fit,.faq-layout{gap:44px}}
@media(max-width:760px){.wrap{width:calc(100% - 36px)}.offer{font-size:11px;padding:10px 16px}.offer a{margin-left:5px}.nav{padding:19px 0}.brand{font-size:30px}nav{gap:12px;font-size:12px}nav .desktop-nav{display:none}.nav-buy{padding:7px 11px}.hero{grid-template-columns:1fr;padding:32px 0;gap:35px}.hero h1{font-size:40px;max-width:17ch}.audience{font-size:12px;margin-bottom:17px;max-width:40ch}.hero .intro{font-size:16px;max-width:45ch}.hero .actions{display:grid;grid-template-columns:1fr 1fr}.hero .btn{font-size:12px;padding:13px 9px;gap:6px}.hero .btn .arrow{width:13px}.reassurance{font-size:11px}.hero-proof{max-width:530px;width:100%;margin:auto}.source{margin:0 17px}.proof-line{display:grid;grid-template-columns:1fr 1fr;gap:15px;font-size:11px;padding:20px 0}.section{padding:52px 0}.section-heading{display:block;margin-bottom:27px}.section-heading p{margin-top:18px}.workflow{grid-template-columns:1fr;gap:26px}.step{display:grid;grid-template-columns:33px 1fr;column-gap:10px}.step-number{grid-row:1/4;margin:4px 0 0}.step .file-label{justify-self:start}.step p{margin-bottom:13px}.demo-layout,.quote,.fit,.faq-layout{grid-template-columns:1fr;gap:28px}.demo-copy{grid-row:1}.demo-copy h2{max-width:17ch}.demo-copy p{margin:17px 0}.quote{padding-top:26px;margin-top:25px;gap:20px}.quote blockquote{font-size:22px}.fit h2{max-width:16ch}.fit p{font-size:14px}.input-list li{grid-template-columns:90px 1fr;gap:14px;font-size:13px}.purchase{padding:30px 24px;grid-template-columns:1fr;gap:25px}.purchase h2{font-size:38px;max-width:15ch}.purchase .lead{margin:17px 0}.purchase-price strong{font-size:59px}.price-side .terms{font-size:11px}.faq-layout{gap:27px}.faq-layout h2{max-width:16ch}.resource{grid-template-columns:1fr;gap:20px}.resource .btn{justify-self:start}.newsletter{line-height:1.8}.footer{align-items:flex-start;flex-direction:column;gap:20px}.footer-links{gap:17px}.track-grid{grid-template-columns:58px 1fr;padding:14px 9px;gap:6px}.timeline-bar{padding:12px}.timeline-bottom{font-size:9px;padding:10px}.clip strong{font-size:11px}.descriptions .clip{font-size:8px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*{transition:none!important}.source{transform:none}}
/* Readable labels at every viewport; condensed timeline text expands in the scene detail. */
.timeline-bar span:last-child,.time-ruler,.track-label,.clip,.descriptions .clip,.timeline-bottom,.caption,.video-note,.quote .credits{font-size:11px}
.hero h1{max-width:18ch;font-size:clamp(40px,4.2vw,58px)}
.source table{font-size:12px}
.caption,.video-note,.quote .credits,.reassurance,.file-label{font-size:12px}
@media(max-width:760px){.hero h1{font-size:39px;max-width:17ch}.timeline-bar{gap:10px}.timeline-bar span:last-child{white-space:nowrap}.track-grid{grid-template-columns:75px 1fr}.source{padding:14px}.source table{font-size:11px}.transfer{font-size:11px;gap:6px}.timeline-bottom{gap:12px}.hero .actions{grid-template-columns:1fr 1fr}.proof-line{font-size:12px}.price-side .terms{font-size:12px}.scene-detail{align-items:flex-start}.hero-points{font-size:13px}.offer{font-size:12px}}

.hero{padding-top:36px;padding-bottom:36px;grid-template-columns:1.06fr 1fr}
.hero h1{font-size:48px;line-height:1.08;max-width:none}
.audience{font-size:13px;max-width:none;margin-bottom:16px}
.hero .intro{margin-top:18px;margin-bottom:14px}
@media(max-width:760px){.hero{grid-template-columns:1fr;padding-top:28px}.hero h1{font-size:36px}.audience{font-size:12px}}

.quote-carousel .quote{min-height:162px}
.quote-copy{min-width:0}
.quote-carousel blockquote{height:4.2em;overflow:visible}
.quote-controls{display:flex;align-items:center;gap:12px;margin-top:12px;font:11px var(--mono);color:var(--muted)}
.quote-controls button{background:none;border:1px solid #bcb198;color:var(--ink);padding:5px;min-width:30px;height:30px;display:inline-flex;align-items:center;justify-content:center;border-radius:2px}
.quote-controls button:hover{background:var(--paper)}
.quote-controls svg{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:1.5}
#quote-position{min-width:105px;text-align:center;font-variant-numeric:tabular-nums}
#quote-toggle{margin-left:4px;padding:5px 9px;min-width:63px;font:11px var(--mono)}
@media(max-width:760px){.quote-carousel .quote{min-height:270px}.quote-carousel .credits{min-height:38px}.quote-carousel blockquote{height:4.2em}.quote-controls{gap:10px}}

/* ============================================================
   Production additions. Nothing above this line differs from the
   approved mockup apart from the removed preview notices.
   ============================================================ */

/* Launch offer switch. The inline script in the <head> of index.html
   sets data-offer="standard" on <html> once the launch ends. Both
   versions of each price are in the markup and this picks one, so
   the price, the terms and the checkout link can never disagree. */
html[data-offer="standard"] .launch-only { display: none !important; }
html:not([data-offer="standard"]) .standard-only { display: none !important; }

/* Testimonial type. The one place this file departs from the mockup,
   at Angelo's request (2026-09-20). The mockup set the quotes at 24px
   (22px on a phone), three short lines to a card, which cut the two
   testimonials into nine cards on a desktop and twelve on a phone. Now
   they sit at the page's reading size on a longer line, so a card
   holds whole sentences.

   --quote-lines sets the height of a card. The values here are only
   the starting point. main.js works out the right count from how long
   a line really is and sets it on .quote-carousel, so the box and the
   paging cannot disagree. See "How much goes on a card" there. */
.quote-carousel { --quote-lines: 3; }
.quote-carousel blockquote {
  font-size: 17px;
  line-height: 1.6;
  max-width: 60ch;
  height: calc(var(--quote-lines) * 1.6em);
}
@media (max-width: 1050px) {
  .quote-carousel { --quote-lines: 4; }
}
@media (max-width: 760px) {
  .quote-carousel { --quote-lines: 5; }
  .quote-carousel blockquote { font-size: 16px; }
}

/* The caption is held as tall for C.J. Carpenter, who has no credits
   line, as for Ulrika Akander, whose credits wrap to two lines on a
   narrow column. The mockup held that space on phones only, and 0.4px
   short of two lines, so on an iPad in portrait the page below the
   carousel jumped 16px every time it changed voice. 3.2em is two lines
   of the credits' own type. */
@media (max-width: 900px) {
  .quote-carousel .credits { min-height: 3.2em; }
}

/* Newsletter signup. It stays closed until the visitor asks for it
   from the link in the strip. Never opens by itself. */
.news-form {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin-top: 14px;
  max-width: 460px;
}
.news-form[hidden] { display: none; }
.news-form input[type="email"] {
  flex: 1 1 220px;
  min-width: 0;
  min-height: 40px;
  padding: 8px 12px;
  border: 1px solid var(--ink);
  border-radius: 2px;
  background: var(--white);
  color: var(--ink);
  font-size: 14px;
}
.news-form input[type="email"]::placeholder { color: var(--muted); }
.news-form .btn {
  min-height: 40px;
  padding: 8px 16px;
  font-size: 13px;
}
.news-form .btn:disabled { opacity: .6; }
.news-note {
  margin-top: 10px;
  max-width: 60ch;
  font-size: 12px;
  color: var(--ink);
}
.news-note[hidden] { display: none; }

/* Honeypot: off screen for people, present for bots. */
.news-hp {
  position: absolute;
  left: -9999px;
  width: 1px;
  height: 1px;
  overflow: hidden;
}

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