/* Passport to More — shared styles. Palette + type per Brand Board v1.1 (CANON). */
:root{--nb:#1A1614;--cream:#F5F0E8;--terra:#C17A5B;--hunter:#1E4D35;--sage:#7A8C6E;--clay:#D9A98B;--gray:#8C7B6E;--rule:#D8CCB8;}
*{margin:0;padding:0;box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{background:var(--cream);color:var(--nb);font-family:'Inter',sans-serif;font-size:16px;line-height:1.7;}
body:after{content:"";position:fixed;inset:0;pointer-events:none;opacity:.05;z-index:999;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='140' height='140'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2'/%3E%3C/filter%3E%3Crect width='140' height='140' filter='url(%23n)' opacity='0.55'/%3E%3C/svg%3E");}
.wrap{max-width:1120px;margin:0 auto;padding:0 30px;}
.sc{font-size:10px;letter-spacing:.24em;text-transform:uppercase;font-weight:500;}
a{color:inherit;}
/* masthead */
.mast{border-bottom:1px solid var(--rule);}
.mast .top{display:flex;justify-content:space-between;padding:10px 0;border-bottom:1px solid var(--rule);color:var(--gray);}
.mast .main{display:flex;align-items:center;justify-content:space-between;padding:16px 0;flex-wrap:wrap;gap:10px;}
.brand{display:flex;align-items:center;gap:14px;text-decoration:none;}
.brand img{height:40px;width:40px;mix-blend-mode:multiply;}
.wordmark{font-family:'Cormorant Garamond',serif;font-size:30px;font-weight:400;text-decoration:none;}
.wordmark em{color:var(--terra);}
.idx{display:flex;gap:28px;}
.idx a{text-decoration:none;color:var(--nb);font-size:11px;letter-spacing:.18em;text-transform:uppercase;font-weight:500;}
.idx a span{color:var(--terra);margin-right:6px;font-family:'Cormorant Garamond',serif;font-style:italic;font-size:13px;}
.idx a:hover{color:var(--terra);}
/* hero */
.hero{background:var(--nb);color:var(--cream);position:relative;overflow:hidden;}
.hero .inner{padding:110px 0 90px;position:relative;}
.hero .eyebrow{color:var(--terra);margin-bottom:34px;display:flex;align-items:center;gap:14px;}
.hero .eyebrow:after{content:"";height:1px;width:90px;background:var(--terra);opacity:.55;}
.hero h1{font-family:'Cormorant Garamond',serif;font-weight:300;font-size:clamp(46px,7.6vw,96px);line-height:1.04;letter-spacing:-.01em;max-width:15ch;}
.hero h1 .l2{display:block;padding-left:clamp(30px,8vw,120px);font-style:italic;color:var(--terra);}
.hero .deck{max-width:47ch;margin-top:36px;color:#CFC6B8;font-size:17px;border-left:1px solid rgba(245,240,232,.25);padding-left:22px;}
.hero .side{position:absolute;right:0;top:120px;writing-mode:vertical-rl;color:rgba(245,240,232,.35);font-size:10px;letter-spacing:.34em;text-transform:uppercase;}
.hero .cta{margin-top:46px;display:flex;align-items:center;gap:30px;flex-wrap:wrap;}
.btn{display:inline-block;background:var(--terra);color:var(--nb);text-decoration:none;padding:15px 32px;font-size:11px;letter-spacing:.2em;text-transform:uppercase;font-weight:500;border:none;cursor:pointer;}
.btn:hover{background:var(--clay);}
.arrowlink{color:var(--cream);text-decoration:none;font-size:12px;letter-spacing:.16em;text-transform:uppercase;font-weight:500;border-bottom:1px solid rgba(245,240,232,.4);padding-bottom:4px;}
.arrowlink:hover{color:var(--terra);border-color:var(--terra);}
.hero .folio{display:flex;justify-content:space-between;color:rgba(245,240,232,.4);padding:16px 0;border-top:1px solid rgba(245,240,232,.14);}
/* index of moments */
.moments{padding:100px 0 90px;}
.moments .head{display:grid;grid-template-columns:1fr 1fr;gap:40px;align-items:end;margin-bottom:40px;}
.moments h2{font-family:'Cormorant Garamond',serif;font-weight:300;font-size:clamp(36px,4.6vw,58px);line-height:1.08;}
.moments h2 em{color:var(--terra);}
.moments .head p{color:var(--gray);font-size:14.5px;max-width:40ch;justify-self:end;}
.mrow{display:grid;grid-template-columns:80px 1fr;gap:26px;padding:26px 0;border-top:1px solid var(--rule);align-items:baseline;}
.mrow:last-of-type{border-bottom:1px solid var(--rule);}
.mrow .no{font-family:'Cormorant Garamond',serif;font-style:italic;font-size:26px;color:var(--terra);}
.mrow p{font-family:'Cormorant Garamond',serif;font-weight:300;font-size:clamp(21px,2.6vw,28px);line-height:1.35;max-width:34ch;}
.mrow b{font-weight:400;font-style:italic;color:var(--terra);}
.moments .after{margin-top:34px;display:grid;grid-template-columns:80px 1fr;gap:26px;}
.moments .after p{color:var(--gray);font-size:15px;max-width:52ch;}
/* turn */
.turn{background:var(--terra);color:var(--nb);padding:110px 0;position:relative;}
.turn .q{font-family:'Cormorant Garamond',serif;font-weight:300;font-size:clamp(34px,5.4vw,62px);line-height:1.16;max-width:20ch;}
.turn .q em{font-style:italic;}
.turn .attr{margin-top:26px;font-size:11px;letter-spacing:.22em;text-transform:uppercase;font-weight:500;opacity:.7;}
.turn .bigq{position:absolute;font-family:'Cormorant Garamond',serif;font-size:300px;line-height:1;opacity:.12;top:-30px;left:10px;}
/* story */
.story{padding:110px 0;}
.story .grid{display:grid;grid-template-columns:.85fr 1.15fr;gap:70px;}
.ph{position:relative;}
.ph .frame{aspect-ratio:4/5;background:#E9E0D0;border:1px solid var(--rule);overflow:hidden;}
.ph img{width:100%;height:100%;object-fit:cover;display:block;filter:saturate(.92) contrast(1.02);}
.ph.missing .frame{display:flex;align-items:center;justify-content:center;background:repeating-linear-gradient(45deg,#E9E0D0,#E9E0D0 12px,#EFE7DA 12px,#EFE7DA 24px);}
.ph.missing img{display:none;}
.ph .cap{font-family:'Cormorant Garamond',serif;font-style:italic;font-size:15px;color:var(--gray);margin-top:12px;}
.story .sc{color:var(--sage);}
.story h2{font-family:'Cormorant Garamond',serif;font-weight:300;font-size:clamp(34px,4.2vw,50px);line-height:1.12;margin:14px 0 26px;}
.story h2 em{color:var(--terra);}
.story p{margin:15px 0;max-width:58ch;}
.story p:first-of-type:first-letter{font-family:'Cormorant Garamond',serif;font-size:64px;line-height:.8;float:left;padding:8px 12px 0 0;color:var(--terra);}
.story .sig{font-family:'Cormorant Garamond',serif;font-style:italic;font-size:26px;color:var(--terra);margin-top:28px;}
/* find */
.find{background:var(--nb);color:var(--cream);padding:110px 0;}
.find .head{display:grid;grid-template-columns:1.1fr .9fr;gap:50px;align-items:end;margin-bottom:20px;}
.find h2{font-family:'Cormorant Garamond',serif;font-weight:300;font-size:clamp(34px,4.4vw,54px);line-height:1.1;}
.find h2 em{color:var(--terra);font-style:italic;}
.find .head p{color:#CFC6B8;font-size:15px;max-width:42ch;justify-self:end;}
.fgrid{display:grid;grid-template-columns:1fr 1fr;gap:0;border-top:1px solid rgba(245,240,232,.16);}
.fcell{padding:38px 34px 38px 0;border-bottom:1px solid rgba(245,240,232,.16);}
.fcell:nth-child(odd){border-right:1px solid rgba(245,240,232,.16);}
.fcell:nth-child(even){padding-left:34px;}
.fcell .no{font-family:'Cormorant Garamond',serif;font-style:italic;font-size:22px;color:var(--terra);}
.fcell h3{font-family:'Cormorant Garamond',serif;font-weight:400;font-size:24px;margin:8px 0 10px;}
.fcell p{color:#CFC6B8;font-size:14.5px;max-width:44ch;}
/* kit */
.kitwrap{padding:120px 0 130px;position:relative;}
.kit{display:grid;grid-template-columns:1.05fr .95fr;gap:0;align-items:stretch;}
.kit .left{padding:56px 60px 56px 0;border-top:1px solid var(--rule);}
.kit .sc{color:var(--sage);}
.kit h2{font-family:'Cormorant Garamond',serif;font-weight:300;font-size:clamp(32px,4.2vw,48px);line-height:1.12;margin:14px 0 18px;}
.kit h2 em{color:var(--terra);}
.kit ol{list-style:none;counter-reset:k;margin:22px 0;}
.kit ol li{counter-increment:k;padding:14px 0 14px 54px;position:relative;border-bottom:1px solid var(--rule);font-size:15px;}
.kit ol li:before{content:counter(k,decimal-leading-zero);position:absolute;left:0;top:14px;font-family:'Cormorant Garamond',serif;font-style:italic;font-size:20px;color:var(--terra);}
.kit .right{background:var(--nb);color:var(--cream);padding:56px 48px;position:relative;margin-top:-40px;margin-bottom:-40px;display:flex;flex-direction:column;justify-content:center;}
.kit .stamp{position:absolute;top:26px;right:26px;width:74px;height:74px;border:1.5px solid var(--terra);border-radius:50%;display:flex;align-items:center;justify-content:center;color:var(--terra);font-size:9px;letter-spacing:.16em;text-transform:uppercase;text-align:center;transform:rotate(8deg);line-height:1.5;}
.kit .right .sc{color:var(--terra);}
.kit .right h3{font-family:'Cormorant Garamond',serif;font-weight:300;font-size:32px;margin:12px 0 14px;}
.kit .right p{font-size:14px;color:#CFC6B8;}
.kit-form{margin-top:22px;}
.kit-fallback{margin-top:22px;border:1px solid rgba(245,240,232,.25);padding:24px 20px;font-size:14px;color:#CFC6B8;}
.kit-fallback a{color:var(--cream);}
.kit-fallback a:hover{color:var(--terra);}
/* act */
.act{background:var(--hunter);color:var(--cream);padding:110px 0;}
.act .grid{display:grid;grid-template-columns:1fr auto;gap:50px;align-items:center;}
.act .sc{color:var(--terra);margin-bottom:20px;display:block;}
.act p{font-family:'Cormorant Garamond',serif;font-weight:300;font-size:clamp(30px,4.4vw,50px);line-height:1.22;max-width:24ch;}
.act p em{font-style:italic;color:var(--terra);}
/* colophon */
.colo{padding:56px 0 46px;color:var(--gray);}
.colo .rule{border-top:1px solid var(--rule);padding-top:26px;display:grid;grid-template-columns:1.2fr .8fr .8fr;gap:36px;font-size:13px;}
.colo .disc{font-family:'Cormorant Garamond',serif;font-style:italic;font-size:15px;max-width:44ch;}
.colo h5{font-size:10px;letter-spacing:.2em;text-transform:uppercase;color:var(--sage);margin-bottom:8px;font-weight:500;}
.colo a{color:var(--nb);}
.colo .fin{margin-top:34px;font-size:11px;letter-spacing:.14em;text-transform:uppercase;display:flex;justify-content:space-between;flex-wrap:wrap;gap:10px;}
@media(max-width:860px){
  .idx{display:none;}
  .moments .head,.story .grid,.find .head,.kit{grid-template-columns:1fr;}
  .moments .head p,.find .head p{justify-self:start;}
  .fgrid{grid-template-columns:1fr;}
  .fcell:nth-child(odd){border-right:none;}
  .fcell:nth-child(even){padding-left:0;}
  .kit .left{padding-right:0;}
  .kit .right{margin:0;}
  .act .grid{grid-template-columns:1fr;}
  .colo .rule{grid-template-columns:1fr;}
  .hero .side{display:none;}
  .mrow{grid-template-columns:44px 1fr;}
  .moments .after{grid-template-columns:44px 1fr;}
}
