/*!
 * PRANA — bands, dimension cards, phases, case rows, highlights, forms
 * Part of the PRANA child theme. Values are taken from the approved website design.
 * Do not edit design tokens here for one-off changes: use Elementor Global Styles,
 * or add a page-level override in 06-overrides.css.
 */

/* generic grid */
body.prana.prana .grid{display:grid;gap:clamp(26px,3.4vw,50px)}
body.prana.prana .g-head{max-width:44ch;margin-bottom:clamp(30px,4vw,54px)}

/* band (alternating image/text) */
body.prana.prana .band{display:grid;gap:clamp(22px,3vw,48px);align-items:center;padding-block:clamp(26px,3.4vw,46px);
 border-top:1px solid var(--line)}
body.prana.prana .band:first-of-type{border-top:0}
body.prana.prana .band-img{position:relative;overflow:hidden;background:var(--sand)}
body.prana.prana .band-img img{width:100%;height:100%;object-fit:cover;aspect-ratio:4/3;transition:transform .9s var(--ease)}
body.prana.prana .band-txt h3{margin-bottom:9px}
body.prana.prana .band-cap{font-size:12.5px;letter-spacing:.03em;color:var(--ink-faint);margin-top:12px;max-width:60ch}

/* dimension cards */
body.prana.prana .dims{display:grid;gap:1px;background:var(--line);border-block:1px solid var(--line)}
body.prana.prana .dim{background:var(--cream-warm);padding:var(--dp);display:flex;flex-direction:column;gap:12px}
body.prana.prana .dim{--dp:clamp(24px,3vw,38px)}
body.prana.prana .dim-img{margin:calc(-1*var(--dp)) calc(-1*var(--dp)) 6px;overflow:hidden;background:var(--sand)}
body.prana.prana .dim-img img{aspect-ratio:5/4;object-fit:cover;width:100%;transition:transform 1s var(--ease)}
body.prana.prana .dim:hover .dim-img img{transform:scale(1.035)}
body.prana.prana .dim h3{margin:0}
body.prana.prana .dim p{font-size:14px;margin:0;color:var(--ink-soft)}
body.prana.prana .dim .tags{font-size:11.5px;letter-spacing:.02em;color:var(--ink-faint);line-height:1.6;margin-top:auto;padding-top:12px;border-top:1px solid var(--line)}
body.prana.prana .dim.no-img{justify-content:flex-start}
body.prana.prana .dim.no-img{background:var(--green);color:var(--on-dark)}
body.prana.prana .dim.no-img h3{color:var(--on-dark)}
body.prana.prana .dim.no-img p{color:var(--on-dark-soft)}
body.prana.prana .dim.no-img .tags{margin-top:auto;padding-top:16px;border-top:1px solid var(--line-dark);
 color:var(--gold-pale);letter-spacing:.15em;text-transform:uppercase;font-size:9px}
body.prana.prana .dim.no-img .tags{color:var(--gold);letter-spacing:.14em;text-transform:uppercase;font-size:9.5px}

/* numbered phases */
body.prana.prana .phases{display:grid;border-top:1px solid var(--line)}
body.prana.prana .phase{display:grid;grid-template-columns:52px minmax(0,1fr);gap:4px 18px;padding-block:22px;border-bottom:1px solid var(--line);align-items:baseline}
body.prana.prana .dark .phases,body.prana.prana .dark .phase{border-color:var(--line-dark)}
body.prana.prana .phase-n{font-family:var(--display);font-size:15px;color:var(--gold);font-variant-numeric:tabular-nums;letter-spacing:.08em}
body.prana.prana .dark .phase-n{color:var(--gold-pale)}
body.prana.prana .phase h3{font-size:clamp(18px,1.9vw,23px);margin-bottom:5px}
body.prana.prana .phase p{font-size:14.5px;margin:0;max-width:62ch}
body.prana.prana .phase .keep{font-size:13.5px;color:var(--gold);margin-top:8px;font-style:italic;display:block}
body.prana.prana .dark .phase .keep{color:var(--gold-pale)}

/* needs list */
body.prana.prana .needs{display:grid;gap:0;border-top:1px solid var(--line)}
body.prana.prana .need{padding:13px 0;border-bottom:1px solid var(--line);font-size:14.5px;display:flex;gap:12px;align-items:baseline}
body.prana.prana .need::before{content:"";flex:0 0 auto;width:14px;height:1px;background:var(--gold);transform:translateY(-4px)}

/* case cards */
body.prana.prana .cases{display:grid;gap:clamp(24px,3vw,40px)}
body.prana.prana .case{display:block;background:none;border-top:1px solid var(--line-firm);padding-top:20px;
 transition:.4s var(--ease)}
body.prana.prana .case-img{overflow:hidden;background:var(--sand);margin-bottom:18px}
body.prana.prana .case-img img{width:100%;aspect-ratio:3/2;object-fit:cover;transition:transform 1.1s var(--ease),filter .5s}
body.prana.prana .case:hover .case-img img,body.prana.prana .case:focus-visible .case-img img{transform:scale(1.045)}
body.prana.prana .case-cat{font-size:9.5px;letter-spacing:.19em;text-transform:uppercase;color:var(--gold);margin-bottom:9px}
body.prana.prana .case h3{margin-bottom:8px;transition:color .3s}
body.prana.prana .case:hover h3,body.prana.prana .case:focus-visible h3{color:var(--gold)}
body.prana.prana .case-meta{font-size:11.5px;letter-spacing:.11em;text-transform:uppercase;color:var(--ink-faint);margin-bottom:12px}
body.prana.prana .case p{font-size:14px;color:var(--ink-soft);margin:0}
body.prana.prana .case-go{display:inline-flex;align-items:center;gap:8px;margin-top:14px;font-size:10px;letter-spacing:.18em;
 text-transform:uppercase;color:var(--gold);position:relative}
body.prana.prana .case-go::after{content:"";position:absolute;left:0;bottom:-4px;height:1px;width:0;background:var(--gold);transition:width .45s var(--ease)}
body.prana.prana .case:hover .case-go::after,body.prana.prana .case:focus-visible .case-go::after{width:100%}
body.prana.prana .case-go .ar{transition:transform .35s var(--ease)}
body.prana.prana .case:hover .case-go .ar{transform:translateX(5px)}

/* work index rows */
body.prana.prana .wrows{border-top:1px solid var(--line-firm)}
body.prana.prana .wrow{display:grid;gap:14px 26px;align-items:center;padding-block:clamp(20px,2.6vw,34px);
 border-bottom:1px solid var(--line);transition:.4s var(--ease);position:relative}
body.prana.prana .wrow::after{content:"";position:absolute;left:0;bottom:-1px;height:1px;width:0;background:var(--gold);transition:width .6s var(--ease)}
body.prana.prana .wrow:hover::after,body.prana.prana .wrow:focus-visible::after{width:100%}
body.prana.prana .wrow h3{transition:color .3s;font-size:clamp(20px,2.5vw,30px)}
body.prana.prana .wrow:hover h3,body.prana.prana .wrow:focus-visible h3{color:var(--gold)}
body.prana.prana .wrow-meta{font-size:10.5px;letter-spacing:.16em;text-transform:uppercase;color:var(--ink-faint)}
body.prana.prana .wrow-img{overflow:hidden;background:var(--sand)}
body.prana.prana .wrow-img img{width:100%;aspect-ratio:3/2;object-fit:cover;transition:transform 1.1s var(--ease)}
body.prana.prana .wrow:hover .wrow-img img{transform:scale(1.06)}

/* centred principle statement */
body.prana.prana .principle{text-align:center;padding-block:clamp(20px,4vw,56px)}
body.prana.prana .principle .pull{max-width:24ch;margin-inline:auto}
body.prana.prana .principle .pull.para{max-width:40ch;font-size:clamp(19px,2.6vw,31px);line-height:1.3}
body.prana.prana .principle::before,body.prana.prana .principle::after{content:"";display:block;width:40px;height:1px;
 background:var(--gold);margin:0 auto clamp(24px,3vw,40px)}
body.prana.prana .principle::after{margin:clamp(24px,3vw,40px) auto 0}

/* pull quote */
body.prana.prana .pull{font-family:var(--display);font-size:clamp(26px,4vw,44px);line-height:1.16;
 max-width:20ch;letter-spacing:-.012em;margin:0}
body.prana.prana .pull-wide{max-width:26ch}

/* data list */
body.prana.prana .dl{display:grid;gap:22px 30px;border-top:1px solid var(--line);padding-top:24px}
body.prana.prana .dl dt{font-size:9.5px;letter-spacing:.18em;text-transform:uppercase;color:var(--gold);margin-bottom:7px}
body.prana.prana .dl dd{margin:0;font-size:14px;line-height:1.55;color:var(--ink-soft)}

/* founders */
body.prana.prana .founders{display:grid;gap:1px;background:var(--line);border:1px solid var(--line)}
body.prana.prana .founder{background:var(--cream-warm);padding:clamp(22px,2.8vw,34px)}
body.prana.prana .founder h3{font-size:clamp(17px,1.8vw,21px);margin-bottom:10px}
body.prana.prana .founder h3::before{content:"";display:block;width:26px;height:1px;background:var(--gold);margin-bottom:14px}
body.prana.prana .founder p{font-size:13.8px;line-height:1.62;color:var(--ink-soft);margin:0}

/* ways / four col */
body.prana.prana .ways{display:grid;gap:1px;background:var(--line);border-block:1px solid var(--line)}
body.prana.prana .way{background:var(--cream-warm);padding:clamp(22px,2.6vw,32px)}
body.prana.prana .way h3{font-size:clamp(17px,1.8vw,21px);margin-bottom:9px}
body.prana.prana .way p{font-size:13.8px;color:var(--ink-soft);margin:0}

/* credibility */
body.prana.prana .creds{display:flex;flex-wrap:wrap;gap:10px 26px;align-items:baseline}
body.prana.prana .creds a{font-family:var(--display);font-size:clamp(19px,2.3vw,27px);line-height:1.3;
 color:var(--ink);border-bottom:1px solid transparent;transition:.3s}
body.prana.prana .creds a:hover{color:var(--gold);border-bottom-color:var(--gold)}
body.prana.prana .creds .dot{color:var(--gold);font-size:14px;display:none}
@media (min-width:760px){body.prana.prana .creds .dot{display:inline}}

/* diagnosis */
body.prana.prana .diag{font-family:var(--display);font-size:clamp(19px,2.5vw,29px);line-height:1.42;max-width:30ch;
 color:var(--ink);margin:0}
body.prana.prana .dark .diag{color:var(--on-dark)}

/* form */
body.prana.prana .form{display:grid;gap:20px 26px;max-width:640px}
body.prana.prana .field{display:flex;flex-direction:column;gap:7px}
body.prana.prana .field label{font-size:9.5px;letter-spacing:.18em;text-transform:uppercase;color:var(--gold);font-weight:500}
body.prana.prana .field .req{color:var(--ink-faint);text-transform:none;letter-spacing:0;font-size:10px}
body.prana.prana .field input,body.prana.prana .field select,body.prana.prana .field textarea{font-family:var(--body);font-size:15px;color:var(--ink);
 background:var(--paper);border:1px solid var(--line);padding:13px 15px;transition:border-color .3s}
body.prana.prana .field input:focus,body.prana.prana .field select:focus,body.prana.prana .field textarea:focus{border-color:var(--gold);outline:none}
body.prana.prana .field textarea{min-height:130px;resize:vertical;line-height:1.6}
body.prana.prana .field .hint{font-size:12.5px;color:var(--ink-faint)}
body.prana.prana .check{display:flex;gap:11px;align-items:flex-start;font-size:13px;color:var(--ink-soft);max-width:60ch}
body.prana.prana .check input{margin-top:3px;accent-color:var(--gold)}
body.prana.prana .state{padding:15px 17px;font-size:13.5px;border-left:2px solid;margin-bottom:16px}
body.prana.prana .state.ok{background:rgba(47,107,79,.07);border-color:#2F6B4F;color:#245740}
body.prana.prana .state.err{background:rgba(138,51,36,.07);border-color:#8A3324;color:#7A2E20}
body.prana.prana .state b{display:block;font-size:9.5px;letter-spacing:.16em;text-transform:uppercase;margin-bottom:5px}

body.prana.prana .sketch{background:#0B0B0B;padding:clamp(18px,2.4vw,34px);border:1px solid var(--line)}
body.prana.prana .sketch img{width:100%}
body.prana.prana .ph-hold{background:var(--green);color:var(--on-dark);display:flex;flex-direction:column;
 justify-content:flex-end;gap:8px;padding:clamp(20px,2.6vw,30px);aspect-ratio:5/4}
body.prana.prana .ph-hold b{font-family:var(--display);font-size:clamp(17px,1.9vw,22px);font-weight:400;line-height:1.2}
body.prana.prana .ph-hold span{font-size:9px;letter-spacing:.17em;text-transform:uppercase;color:var(--gold-pale)}
body.prana.prana .ph-hold::before{content:"";width:30px;height:1px;background:var(--gold-pale);margin-bottom:auto}

/* project format cards */
body.prana.prana .projs{display:grid;gap:1px;background:var(--line);border-block:1px solid var(--line)}
body.prana.prana .proj{background:var(--cream-warm);display:flex;flex-direction:column}
body.prana.prana .proj-img{overflow:hidden;background:var(--sand)}
body.prana.prana .proj-img img{width:100%;aspect-ratio:5/4;object-fit:cover;transition:transform 1s var(--ease)}
body.prana.prana .proj:hover .proj-img img{transform:scale(1.035)}
body.prana.prana .proj-b{padding:clamp(20px,2.4vw,28px)}
body.prana.prana .proj-b h3{margin-bottom:7px}
body.prana.prana .proj-b p{font-size:13.8px;color:var(--ink-soft);margin:0}
body.prana.prana .proj .ph-hold{aspect-ratio:5/4}

/* attribution */
body.prana.prana .attrib.up1{font-size:13px}
body.prana.prana .attrib{font-size:12px;line-height:1.55;color:var(--ink-faint);border-left:1px solid var(--gold);
 padding:2px 0 2px 14px;margin:0 0 16px;max-width:62ch}
body.prana.prana .dark .attrib,body.prana.prana .on-photo .attrib{color:rgba(244,239,231,.66);border-left-color:var(--gold-pale)}
body.prana.prana .label{display:inline-block;font-size:9px;letter-spacing:.19em;text-transform:uppercase;
 color:var(--gold);border:1px solid var(--gold);padding:4px 10px;margin-bottom:16px}
body.prana.prana .on-photo .label,body.prana.prana .phero.photo .label{color:var(--gold-pale);border-color:var(--gold-pale)}

body.prana.prana .collhead{display:grid;gap:clamp(26px,3.4vw,52px);align-items:center;margin-bottom:clamp(30px,4vw,54px)}
body.prana.prana .collhead img{width:100%;aspect-ratio:4/5;object-fit:cover}
/* collective network groups */
body.prana.prana .netgrid{display:grid;gap:1px;background:var(--line);border-block:1px solid var(--line)}
body.prana.prana .netcell{background:var(--cream);padding:clamp(24px,3vw,40px);display:flex;flex-direction:column;gap:12px}
body.prana.prana .netcell .lbl{font-size:10px;letter-spacing:.2em;text-transform:uppercase;color:var(--gold);font-weight:500;margin:0}
body.prana.prana .netcell p{font-size:15px;line-height:1.6;color:var(--ink-soft);margin:0;max-width:42ch}
body.prana.prana .netclose{font-family:var(--display);font-size:clamp(19px,2.1vw,25px);line-height:1.34;
 max-width:36ch;margin:clamp(28px,3.4vw,44px) 0 0;padding-top:clamp(22px,2.6vw,32px);
 border-top:1px solid var(--line-firm)}

/* ===== project highlights ===== */
body.prana.prana .ph-sec{padding-block:clamp(48px,7vw,104px)}
body.prana.prana .figs{display:grid;gap:1px;background:var(--line);border-block:1px solid var(--line);margin-bottom:clamp(26px,3.4vw,48px)}
body.prana.prana .fig{background:var(--cream-warm);padding:clamp(22px,2.8vw,34px);display:flex;flex-direction:column;gap:6px}
body.prana.prana .fig b{font-family:var(--display);font-size:clamp(34px,5.2vw,58px);line-height:.96;font-weight:400;
 letter-spacing:-.02em;color:var(--gold);font-variant-numeric:tabular-nums}
body.prana.prana .fig span{font-size:9.5px;letter-spacing:.17em;text-transform:uppercase;color:var(--ink-faint);line-height:1.5}
body.prana.prana .fig.txt b{font-size:clamp(19px,2.2vw,26px);line-height:1.14;letter-spacing:-.005em;color:var(--ink)}
body.prana.prana .fig.txt.sm1 b{font-size:clamp(18px,2.2vw,25px)}
body.prana.prana .dark .fig{background:var(--green-deep)}
body.prana.prana .dark .fig b{color:var(--gold-pale)} body.prana.prana .dark .fig span{color:rgba(244,239,231,.5)}
body.prana.prana .dark .figs{background:var(--line-dark);border-color:var(--line-dark)}

body.prana.prana .mosaic{display:grid;gap:clamp(10px,1.4vw,18px);margin-bottom:clamp(26px,3.4vw,44px)}
body.prana.prana .mosaic img{width:100%;height:100%;object-fit:cover;display:block}
body.prana.prana .m-tall{aspect-ratio:3/4} body.prana.prana .m-wide{aspect-ratio:3/2} body.prana.prana .m-sq{aspect-ratio:1/1} body.prana.prana .m-pano{aspect-ratio:21/9}

body.prana.prana .chips{display:flex;flex-wrap:wrap;gap:7px 8px;margin:0 0 8px}
body.prana.prana .chip-i{font-size:10px;letter-spacing:.11em;text-transform:uppercase;color:var(--ink-soft);
 border:1px solid var(--line-firm);padding:6px 12px;border-radius:2px}
body.prana.prana .dark .chip-i{color:var(--on-dark-soft);border-color:var(--line-dark)}

body.prana.prana .timeline{display:grid;gap:0;border-top:1px solid var(--line);margin:0 0 8px}
body.prana.prana .tl{display:grid;grid-template-columns:78px minmax(0,1fr);gap:4px 18px;padding:14px 0;
 border-bottom:1px solid var(--line);align-items:baseline}
body.prana.prana .tl b{font-family:var(--display);font-size:16px;color:var(--gold);font-variant-numeric:tabular-nums;font-weight:400}
body.prana.prana .tl span{font-size:13.5px;color:var(--ink-soft);line-height:1.5}
body.prana.prana .dark .timeline,body.prana.prana .dark .tl{border-color:var(--line-dark)}
body.prana.prana .dark .tl span{color:var(--on-dark-soft)} body.prana.prana .dark .tl b{color:var(--gold-pale)}

body.prana.prana .quote-band{font-family:var(--display);font-size:clamp(21px,3vw,34px);line-height:1.24;
 max-width:26ch;letter-spacing:-.01em;margin:0}
body.prana.prana .quote-band.long{font-size:clamp(18px,2.3vw,27px);line-height:1.3;max-width:40ch}
body.prana.prana .credit{font-size:10.5px;letter-spacing:.15em;text-transform:uppercase;color:var(--ink-faint);margin-top:14px}
body.prana.prana .dark .credit{color:rgba(244,239,231,.46)}

body.prana.prana .beliefgrid{display:grid;gap:clamp(22px,3vw,34px)}
body.prana.prana .belief-main{font-family:var(--display);font-size:clamp(26px,4.2vw,46px);line-height:1.14;
 letter-spacing:-.014em;max-width:19ch;margin:0;color:var(--on-dark)}
body.prana.prana .belief-sub{font-family:var(--display);font-size:clamp(17px,2vw,23px);line-height:1.4;
 color:var(--on-dark-soft);max-width:26ch;margin:0;padding-top:clamp(16px,2vw,22px);
 border-top:1px solid var(--line-dark)}

/* SUDA warm */
body.prana.prana .suda{background:#EFE6DA;color:#3A2F26}
body.prana.prana .suda h1,body.prana.prana .suda h2,body.prana.prana .suda h3{color:#3A2F26}
body.prana.prana .suda p{color:rgba(58,47,38,.76)}
body.prana.prana .suda .eyebrow{color:#A8794E}
body.prana.prana .suda .btn{border-color:#A8794E;color:#A8794E}
body.prana.prana .suda .btn:hover{background:#A8794E;color:#F7F1E8}

/* annotation pins */
body.prana.prana .pin{display:inline-flex;align-items:center;gap:6px;font-family:var(--body);font-size:9px;
 letter-spacing:.14em;text-transform:uppercase;color:#8A6414;background:rgba(138,100,20,.09);
 padding:4px 9px;border-radius:2px;margin-left:10px;vertical-align:3px;font-weight:600}
body[data-notes="off"] .pin{display:none}