/* Marriage page: lazo cord, four marks, rite walk-through, date planner, steps, courses */
.mar-hero{position:relative;isolation:isolate}
.mar-hero .wrap{position:relative;z-index:1}
.mar-hero .mg-grid{display:none!important}
.mar-hero-cta{display:flex;gap:12px;flex-wrap:wrap;margin-top:26px}
.mar-frame{position:relative;aspect-ratio:4/5!important;max-height:560px;overflow:visible!important;background:none!important}
.mar-frame img{border-radius:var(--r);box-shadow:0 30px 60px -30px rgba(0,0,0,.7);position:relative;z-index:1}
.mar-lazo{position:absolute;inset:-14%;width:128%;height:128%;pointer-events:none;overflow:visible}
.mar-lazo .back{z-index:0}
.lazo-a{fill:none;stroke:#D9A85E;stroke-width:1.5;stroke-linecap:round}
.lazo-b{fill:none;stroke:#F6ECD9;stroke-width:.55;stroke-linecap:round;stroke-dasharray:1.1 1}
.lazo-front{position:absolute;inset:-14%;width:128%;height:128%;pointer-events:none;z-index:2;overflow:visible}
.mar-stats{background:var(--ink);color:var(--white)}
.mar-stats .wrap{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(28px,5vw,64px);align-items:center;padding-block:56px}
.mar-stats h2{font-size:clamp(1.7rem,3vw,2.4rem);margin-top:10px}
.mar-stats p{color:#C9D6DE;margin-top:14px;max-width:52ch}
.mar-stats .eyebrow{color:var(--gold)}
.mar-src{font-size:.82rem;color:#9FB2C0!important}
.mar-bars{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px;align-items:end;height:280px}
.mar-bars .bar{display:flex;flex-direction:column;justify-content:flex-end;align-items:stretch;height:100%;gap:8px}
.mar-bars b{font:600 clamp(1.1rem,2vw,1.5rem)/1 var(--f-display);color:var(--gold);font-variant-numeric:tabular-nums}
.mar-bars .fill{display:block;height:calc(var(--v)*190px);background:linear-gradient(#D9A85E,#9A6224);border-radius:6px 6px 0 0;transform-origin:bottom;transition:transform 1.2s cubic-bezier(.2,.7,.2,1)}
.mar-bars.pre .fill{transform:scaleY(.02)}
.mar-bars small{font:600 .72rem/1 var(--f-label);letter-spacing:.18em;color:#C9D6DE;border-top:1px solid #33465A;padding-top:8px}
.mar-marks{display:flex;flex-wrap:wrap;gap:10px;margin:28px 0 22px}
.mar-marks button{display:inline-flex;align-items:center;gap:10px;font:700 1rem/1 var(--f-body);padding:12px 22px 12px 14px;min-height:50px;border-radius:99px;border:1.5px solid var(--line);background:var(--white);color:var(--teal);cursor:pointer;transition:background .2s,color .2s,border-color .2s}
.mar-marks button:hover{border-color:var(--teal)}
.mar-marks button[aria-selected="true"]{background:var(--teal);border-color:var(--teal);color:var(--white)}
.mar-marks .ring{width:22px;height:22px;border-radius:50%;border:3px solid var(--gold);box-shadow:inset 0 0 0 2px rgba(255,255,255,.4)}
.mar-mark-panel{max-width:760px;animation:marIn .45s ease both}
.mar-mark-panel h3{font-size:clamp(1.6rem,2.6vw,2.1rem);color:var(--teal)}
.mar-mark-panel p{color:var(--muted);margin-top:12px}
.mar-mark-panel blockquote{margin:22px 0 0;padding:14px 18px;border-left:3px solid var(--gold);background:var(--mist);font:italic 400 1.1rem/1.5 var(--f-display);color:var(--ink);border-radius:0 6px 6px 0}
.mar-mark-panel cite{display:block;margin-top:8px;font:600 .68rem/1 var(--f-label);font-style:normal;letter-spacing:.18em;text-transform:uppercase;color:var(--gold-ink)}
@keyframes marIn{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}
.mar-rite{list-style:none;margin:30px 0 0;padding:0;display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:10px}
.mar-rite button{width:100%;height:100%;display:flex;align-items:center;gap:12px;text-align:left;padding:16px;border:1.5px solid var(--line);border-radius:12px;background:var(--white);cursor:pointer;font:700 1rem/1.25 var(--f-body);color:var(--teal);transition:border-color .2s,background .2s,transform .2s}
.mar-rite button:hover{border-color:var(--teal);transform:translateY(-2px)}
.mar-rite button[aria-expanded="true"]{background:var(--teal);border-color:var(--teal);color:var(--white)}
.mar-rite .n,.mar-steps .n{flex:none;display:grid;place-items:center;width:32px;height:32px;border-radius:50%;border:1.5px solid currentColor;font:700 .85rem/1 var(--f-body)}
.mar-rite button[aria-expanded="true"] .n{background:var(--gold);border-color:var(--gold);color:var(--ink)}
.mar-rite-detail{margin-top:18px;padding:24px 26px;background:var(--white);border-radius:12px;border:1px solid var(--line);animation:marIn .4s ease both}
.mar-rite-detail h3{color:var(--teal);font-size:1.4rem}
.mar-rite-detail p{margin-top:10px;color:var(--muted);max-width:72ch}
.mar-plan-copy{display:grid;gap:14px;align-content:start}
.mar-plan-copy .lede{margin:0}
.mar-plan-copy label{font:700 1rem/1.3 var(--f-body);color:var(--teal);text-transform:none;letter-spacing:normal;margin-top:8px}
.mar-plan-copy input{font:700 1rem var(--f-body);padding:10px 14px;min-height:48px;max-width:260px;border:1.5px solid var(--line);border-radius:8px;background:var(--white);color:var(--teal)}
.mar-plan-out{border-top:4px solid var(--gold);min-height:220px}
.mar-plan-idle{color:var(--muted);margin:auto 0}
.mar-count{font:600 clamp(2.2rem,4vw,3rem)/1 var(--f-display);color:var(--teal)}
.mar-count small{display:block;margin-top:6px;font:600 .72rem/1 var(--f-label);letter-spacing:.18em;text-transform:uppercase;color:var(--muted)}
.mar-tl{list-style:none;margin:16px 0 0;padding:0;display:grid;gap:0}
.mar-tl li{position:relative;padding:10px 0 10px 26px;border-left:2px solid var(--line);margin-left:6px}
.mar-tl li::before{content:"";position:absolute;left:-8px;top:15px;width:14px;height:14px;border-radius:50%;background:var(--white);border:2px solid var(--gold)}
.mar-tl li.past::before{background:var(--gold)}
.mar-tl li.warn::before{background:#8A4B3C;border-color:#8A4B3C}
.mar-tl b{display:block;color:var(--teal)}
.mar-tl span{display:block;font-size:.92rem;color:var(--muted)}
.mar-steps-top{display:flex;align-items:center;gap:16px;margin:26px 0 14px}
.mar-progress svg{width:96px;height:48px}
.mar-progress circle{fill:none;stroke:var(--line);stroke-width:5}
.mar-progress .r1,.mar-progress .r2{stroke:var(--gold);stroke-dasharray:138.2;stroke-dashoffset:138.2;transition:stroke-dashoffset .5s ease;transform-origin:center;transform-box:fill-box;transform:rotate(-90deg)}
.mar-progress-bg circle{stroke:var(--line)}
.mar-steps-count{margin:0;font-weight:700;color:var(--teal)}
.mar-steps{list-style:none;margin:0;padding:0;display:grid;gap:8px}
.mar-steps li{background:var(--white);border:1px solid var(--line);border-radius:10px;overflow:hidden;transition:border-color .2s}
.mar-steps li.done{border-color:var(--gold)}
.mar-steps .row{display:flex;align-items:center;gap:12px;padding:0 16px}
.mar-steps input{flex:none;width:22px;height:22px;accent-color:var(--teal);cursor:pointer}
.mar-steps .row button{flex:1;display:flex;align-items:center;gap:14px;text-align:left;padding:14px 0;min-height:56px;border:0;background:none;font:700 1rem/1.35 var(--f-body);color:var(--teal);cursor:pointer}
.mar-steps .row button::after{content:"+";margin-left:auto;font-size:1.3rem;color:var(--gold-ink);transition:transform .2s}
.mar-steps .row button[aria-expanded="true"]::after{transform:rotate(45deg)}
.mar-steps li.done .row button{color:var(--muted);text-decoration:line-through;text-decoration-color:rgba(154,98,36,.5)}
.mar-steps .detail{padding:0 16px 16px 84px;color:var(--muted)}
.mar-steps .detail p{margin:0;max-width:70ch}
.mar-steps .detail a{color:var(--gold-ink);font-weight:700}
.mar-note{margin-top:14px;font-size:.88rem;color:var(--muted)}
.mar-note a{color:var(--teal);font-weight:700}
.mar-chips{display:flex;flex-wrap:wrap;gap:8px;margin:24px 0 18px}
.mar-chips button{font:700 .9rem/1 var(--f-body);padding:12px 20px;min-height:46px;border-radius:99px;border:1.5px solid var(--line);background:var(--white);color:var(--teal);cursor:pointer}
.mar-chips button[aria-pressed="true"]{background:var(--teal);border-color:var(--teal);color:var(--white)}
.mar-courses{display:grid;grid-template-columns:repeat(auto-fill,minmax(190px,1fr));gap:14px}
.mar-course{background:var(--white);border:1px solid var(--line);border-radius:12px;padding:22px;display:flex;flex-direction:column;gap:8px;animation:marIn .35s ease both}
.mar-course h3{color:var(--teal);font-size:1.2rem}
.mar-course p{color:var(--muted);font-size:.95rem;margin:0}
.mar-course dl{display:grid;grid-template-columns:auto 1fr;gap:4px 12px;margin:8px 0 0;padding-top:10px;border-top:1px solid var(--line);font-size:.92rem}
.mar-course dt{font:600 .66rem/1.7 var(--f-label);letter-spacing:.16em;text-transform:uppercase;color:var(--muted)}
.mar-course dd{margin:0;font-weight:700;color:var(--teal)}
.mar-faq{display:grid;gap:10px;margin-top:28px;max-width:820px}
.mar-faq details{background:var(--white);border:1px solid var(--line);border-radius:10px;padding:0 20px}
.mar-faq summary{cursor:pointer;list-style:none;padding:18px 28px 18px 0;font-weight:700;color:var(--teal);position:relative}
.mar-faq summary::-webkit-details-marker{display:none}
.mar-faq summary::after{content:"+";position:absolute;right:0;top:50%;transform:translateY(-50%);font-size:1.4rem;color:var(--gold-ink);transition:transform .2s}
.mar-faq details[open] summary::after{transform:translateY(-50%) rotate(45deg)}
.mar-faq details p{margin:0 0 18px;color:var(--muted)}
#faq{background:var(--paper)}
.mar-office-copy{display:grid;gap:14px;align-content:start}
.mar-office-copy .lede{margin:0}
.mar-links{display:grid;gap:12px;margin-top:8px}
.mar-links a{font-weight:700;color:var(--teal)}
.mar-office{border-top:4px solid var(--gold);display:grid;grid-template-columns:110px minmax(0,1fr);gap:20px;align-items:start}
.mar-office img{width:110px;aspect-ratio:1;object-fit:cover;border-radius:10px}
.mar-office dl{display:grid;grid-template-columns:auto 1fr;gap:6px 14px;margin:10px 0 14px}
.mar-office dt{font:600 .68rem/1.7 var(--f-label);letter-spacing:.16em;text-transform:uppercase;color:var(--muted)}
.mar-office dd{margin:0;font-weight:700;color:var(--teal);overflow-wrap:anywhere;user-select:all}
.mar-sources{background:var(--paper);border-top:1px solid var(--line)}
.mar-sources .wrap{padding-block:32px}
.mar-sources h2{font:600 .72rem/1 var(--f-label);letter-spacing:.2em;text-transform:uppercase;color:var(--muted)}
.mar-sources ul{margin:14px 0 0;padding-left:18px;display:grid;gap:6px;font-size:.9rem}
.mar-sources a{color:var(--teal)}
/* side cord navigator */
.mar-rail{position:fixed;left:22px;top:50%;transform:translate(-12px,-50%);z-index:40;display:none;flex-direction:column;align-items:flex-start;gap:20px;padding:18px 0;opacity:0;pointer-events:none;transition:opacity .35s,transform .35s}
.mar-rail.show{opacity:1;transform:translate(0,-50%);pointer-events:auto}
.rail-cord{position:absolute;left:16px;top:0;bottom:0;width:4px;border-radius:2px;background:repeating-linear-gradient(160deg,#E8DCC6 0 5px,#D8C7A8 5px 10px);overflow:hidden}
.rail-cord i{position:absolute;inset:0;background:repeating-linear-gradient(160deg,#D9A85E 0 5px,#B9853F 5px 10px);transform-origin:top;transform:scaleY(0)}
.mar-rail a{position:relative;display:flex;align-items:center;gap:10px;text-decoration:none;min-height:36px}
.mar-rail svg{width:36px;height:36px;flex:none;border-radius:50%;background:var(--white);border:1.5px solid #D8C7A8;transition:background .3s,border-color .3s,transform .2s}
.mar-rail svg circle{fill:none;stroke:#B9A27F;stroke-width:1.8}
.mar-rail a.done svg{background:var(--teal);border-color:var(--teal)}
.mar-rail a.done svg circle{stroke:#D9A85E}
.mar-rail a[aria-current] svg{transform:scale(1.15);box-shadow:0 0 0 4px rgba(217,168,94,.35)}
.mar-rail a span{font:700 .78rem/1 var(--f-body);color:var(--teal);background:var(--white);border:1px solid var(--line);padding:7px 10px;border-radius:6px;white-space:nowrap;opacity:0;transform:translateX(-6px);transition:opacity .2s,transform .2s;pointer-events:none}
.mar-rail a:hover span,.mar-rail a:focus-visible span{opacity:1;transform:none}
.mar-rail a:focus-visible{outline:none}.mar-rail a:focus-visible svg{outline:3px solid var(--gold);outline-offset:2px}
@media (min-width:1320px){.mar-rail{display:flex}}
@media (max-width:900px){.mar-stats .wrap{grid-template-columns:minmax(0,1fr)}.mar-bars{height:240px}.mar-rite{grid-template-columns:minmax(0,1fr)}.mar-frame{aspect-ratio:4/3!important}.mar-office{grid-template-columns:minmax(0,1fr)}.mar-office img{width:100%;aspect-ratio:16/10}.mar-steps .detail{padding-left:50px}}
@media (prefers-reduced-motion:reduce){.mar-mark-panel,.mar-rite-detail,.mar-course{animation:none}.mar-bars .fill,.mar-progress .r1,.mar-progress .r2,.mar-rail,.mar-rail svg{transition:none}}

.mar-progress .bg{fill:none;stroke:var(--line);stroke-width:5}
.mar-office .btn{white-space:normal}

@media (max-width:900px){.mar-frame{width:80%;margin:24px auto 30px!important}}
