/* ricksanchez.org — site styles
   Type: Cormorant Garamond (display) + Jost (text), loaded from Google Fonts in each page head.
   Palette, spacing and components below match the approved mockups 1:1. */

:root{
  --ink:#0C0D0E; --ink-2:#141618; --paper:#FAF7F1; --paper-2:#F3EFE6; --card:#FFFDF8;
  --gold:#C09A3E; --gold-lt:#E0C382; --gold-dk:#8A6E2A;
  --text:#1E2022; --muted:#5F615F; --line:#E3DCCB; --line-2:#D8D0BC;
  --sans:'Jost',system-ui,sans-serif; --serif:'Cormorant Garamond',Georgia,serif;
}
*{box-sizing:border-box;margin:0;padding:0}
body{background:var(--paper);color:var(--text);font-family:var(--sans);font-weight:300;-webkit-font-smoothing:antialiased}
.wrap{max-width:1180px;margin:0 auto;padding:0 48px}
h1,h2,h3{font-family:var(--serif);font-weight:400;letter-spacing:.005em}
p{line-height:1.72}
a{text-decoration:none;color:inherit}
.dia{width:5px;height:5px;background:var(--gold);transform:rotate(45deg);flex:none}

.lab{display:flex;align-items:center;gap:14px;font-size:10.5px;letter-spacing:.30em;text-transform:uppercase;color:var(--gold-dk);font-weight:400}
.lab .num{font-family:var(--serif);font-size:13px;letter-spacing:.08em;color:var(--gold)}
.lab i{display:block;width:44px;height:1px;background:var(--gold);opacity:.55}
.lab.on-dark{color:var(--gold-lt)}
.lab.on-dark .num{color:var(--gold-lt)}
.lab.mid{justify-content:center}

.btn{display:inline-block;font-size:11.5px;letter-spacing:.20em;text-transform:uppercase;padding:14px 26px;border:1px solid var(--gold);color:var(--gold-dk);white-space:nowrap}
.btn.solid{background:var(--gold);border-color:var(--gold);color:#141210;font-weight:400}
.btn.ghost-d{border-color:rgba(224,195,130,.45);color:var(--gold-lt)}
.more{display:inline-block;margin-top:28px;font-size:11px;letter-spacing:.2em;text-transform:uppercase;color:var(--gold-dk);border-bottom:1px solid var(--gold);padding-bottom:6px}

/* ---------- nav ---------- */
.util{background:var(--ink);color:#8E8A81;position:relative;z-index:1}
.util-in{display:flex;align-items:center;justify-content:flex-end;height:40px;font-size:10px;font-weight:500;letter-spacing:.24em;text-transform:uppercase}
.util .r{display:flex;gap:30px}
.util .r a{white-space:nowrap}
.util .r a{color:#DAD5C9}
nav{background:var(--paper);border-bottom:1px solid var(--line);position:relative;z-index:5}
.mast{position:relative;display:flex;align-items:center;height:138px;padding-left:216px}
.brand{position:absolute;left:22px;top:0;bottom:0;display:flex;align-items:center}
.namewrap{width:100%;text-align:center}
.brand img{height:250px;display:block;position:relative;top:26px;z-index:6;filter:drop-shadow(0 12px 30px rgba(0,0,0,.38))}
.namewrap .nm{font-family:var(--serif);font-size:42px;font-weight:700;text-transform:uppercase;letter-spacing:.045em;color:#0E1012;line-height:1;white-space:nowrap}
.namewrap .sub{font-size:10px;font-weight:500;letter-spacing:.30em;color:var(--gold-dk);margin-top:14px;text-transform:uppercase;white-space:nowrap}
.namewrap .sub sup{font-size:7.5px;letter-spacing:0;vertical-align:super;margin-left:2px}
.navband{border-top:1px solid var(--line)}
.navlinks{display:flex;align-items:center;justify-content:space-between;height:58px;padding-left:216px}
.navlinks a{font-size:11px;font-weight:500;white-space:nowrap;letter-spacing:.17em;text-transform:uppercase;color:#26282A}

/* ---------- hero ---------- */
.hero{background:var(--ink);color:#F4F1E9;position:relative;z-index:0;overflow:hidden;border-bottom:1px solid var(--gold-dk)}
.hero::before{content:"";position:absolute;inset:22px;border:1px solid rgba(192,154,62,.22);pointer-events:none}
.hero-in{display:grid;grid-template-columns:1.32fr .68fr;gap:64px;align-items:center;padding:72px 0 70px;position:relative}
.hero h1{font-size:53px;line-height:1.14;color:#FBF8F1;font-weight:300}
.hero .rule{width:76px;height:1px;background:var(--gold);margin:26px 0 24px}
.hero p.lede{font-size:16.5px;line-height:1.8;color:#C3BFB5;max-width:33em}
.cta{display:flex;gap:16px;margin-top:32px}
.photo{position:relative;padding:14px;max-width:330px;justify-self:end}
.photo .fr{position:absolute;inset:0;border:1px solid rgba(192,154,62,.45)}
.photo img{width:100%;display:block;position:relative}

/* ---------- credential strip ---------- */
.strip{border-bottom:1px solid var(--line);background:var(--paper)}
.strip-in{display:grid;grid-template-columns:repeat(5,1fr);padding:0}
.strip-in div{padding:30px 14px;text-align:center;border-left:1px solid var(--line)}
.strip-in div:first-child{border-left:none}
.strip-in span{font-size:9.5px;letter-spacing:.17em;text-transform:uppercase;color:#5F615F;display:block}
.strip-in em{font-style:normal;display:block;font-family:var(--serif);font-size:15px;color:var(--gold);margin-bottom:8px}

/* ---------- value strip (dark) ---------- */
.vals{background:var(--ink);color:#EDE9E0}
.vals-in{display:grid;grid-template-columns:repeat(5,1fr);gap:0;padding:0}
.vals-in div{padding:42px 26px;text-align:center;border-left:1px solid rgba(255,255,255,.08)}
.vals-in div:first-child{border-left:none}
.vals-in h4{font-family:var(--sans);font-weight:500;font-size:10px;letter-spacing:.22em;text-transform:uppercase;color:var(--gold-lt)}
.vals-in p{font-size:12.5px;color:#A5A198;margin-top:14px;line-height:1.7}

/* ---------- sections ---------- */
section{padding:100px 0}
.sec-head{max-width:800px}
.sec-head h2{font-size:44px;line-height:1.14;margin-top:0}
.sec-head p{margin-top:20px;color:var(--muted);font-size:17px;max-width:42em}
.sec-head.mid{max-width:760px;margin:0 auto;text-align:center}
.alt{background:var(--paper-2)}

/* ---------- service cards ---------- */
.cards{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:var(--line);border:1px solid var(--line);margin-top:56px}
.card{background:var(--card);padding:42px 34px 38px;display:flex;flex-direction:column}
.card .n{font-family:var(--serif);font-size:30px;color:var(--gold);line-height:1}
.card h3{font-size:26px;margin-top:14px;line-height:1.2}
.card .ln{width:26px;height:1px;background:var(--gold);margin:18px 0 16px;opacity:.6}
.card p{font-size:14.5px;color:var(--muted)}
.card ul{list-style:none;margin-top:20px}
.card li{font-size:13px;color:#6C6E6C;padding:9px 0 9px 18px;position:relative;border-top:1px solid var(--line)}
.card li::before{content:"";position:absolute;left:0;top:15px;width:4px;height:4px;background:var(--gold);transform:rotate(45deg)}
.card .more{margin-top:26px;align-self:flex-start}

/* ---------- four steps ---------- */
.steps{display:grid;grid-template-columns:repeat(4,1fr);gap:0;margin-top:60px;position:relative}
.steps::before{content:"";position:absolute;top:6px;left:8%;right:8%;height:1px;background:var(--line-2)}
.step{padding:0 26px;text-align:center;position:relative}
.step .dot{width:11px;height:11px;background:var(--paper-2);border:1px solid var(--gold);transform:rotate(45deg);margin:0 auto;position:relative}
.step .n{font-family:var(--serif);font-size:15px;color:var(--gold);margin-top:22px;letter-spacing:.1em}
.step h3{font-size:11px;font-family:var(--sans);font-weight:400;letter-spacing:.26em;text-transform:uppercase;margin-top:12px;color:#24262A}
.step p{font-size:13.5px;color:var(--muted);margin-top:14px;line-height:1.68}

/* ---------- why band ---------- */
.band{background:var(--ink);color:#F2EFE7;padding:96px 0;position:relative}
.band::before{content:"";position:absolute;left:0;right:0;top:0;height:1px;background:linear-gradient(90deg,rgba(192,154,62,0),var(--gold),rgba(192,154,62,0))}
.band h2{font-size:44px;color:#FBF8F1;margin-top:0;text-align:center}
.why{display:grid;grid-template-columns:repeat(4,1fr);gap:34px;margin-top:58px}
.why div{border-top:1px solid rgba(192,154,62,.45);padding-top:22px}
.why h3{font-size:22px;color:#FBF8F1;line-height:1.25}
.why p{font-size:13.5px;color:#A5A198;margin-top:14px;line-height:1.7}

/* ---------- about ---------- */
.about{display:grid;grid-template-columns:.92fr 1.08fr;gap:76px;align-items:start}
.about h2{font-size:42px;line-height:1.16;margin-top:0}
.about p{color:var(--muted);margin-top:20px;font-size:16.5px}
.pullbox{display:flex;align-items:center;gap:22px;border:1px solid var(--line-2);background:var(--card);padding:24px 28px;margin-top:34px}
.pullbox img{height:52px;display:block}
.pullbox span{font-family:var(--serif);font-size:20px;line-height:1.4;color:#2A2C2C}
.roles{border-top:1px solid var(--line)}
.role{display:grid;grid-template-columns:150px 1fr;gap:28px;padding:22px 0;border-bottom:1px solid var(--line);align-items:baseline}
.role b{font-weight:400;font-size:10.5px;letter-spacing:.26em;text-transform:uppercase;color:var(--gold-dk)}
.role p{margin:0;font-size:14px;color:#4A4C4A;line-height:1.65}
.role .use{font-family:var(--serif);font-style:italic;font-size:16.5px;line-height:1.5;color:#2C2E31;margin-top:10px}

/* ---------- publications + speaking ---------- */
.two{display:grid;grid-template-columns:1fr 1px 1fr;gap:60px;margin-top:56px;align-items:start}
.vline{background:var(--line);height:100%}
.two h3{font-size:29px}
.item{padding:20px 0;border-bottom:1px solid var(--line)}
.item .ttl{font-family:var(--serif);font-size:21px;line-height:1.3}
.item .sub{font-size:13px;color:var(--muted);margin-top:6px}

/* ---------- linkedin ---------- */
.li-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:var(--line);border:1px solid var(--line);margin-top:56px}
.li-card{background:var(--card);padding:34px 32px 32px;display:flex;flex-direction:column}
.li-head{display:flex;align-items:center;gap:14px}
.li-mark{width:26px;height:26px;border:1px solid var(--gold);color:var(--gold-dk);font-size:11px;letter-spacing:.04em;display:flex;align-items:center;justify-content:center;flex:none}
.li-head .d{font-size:9.5px;letter-spacing:.22em;text-transform:uppercase;color:#8B8D8B}
.li-card .ex{font-family:var(--serif);font-size:20px;line-height:1.45;color:#24262A;margin-top:22px}
.li-card .body{font-size:13.5px;color:var(--muted);margin-top:14px;line-height:1.7}
.li-card .rd{margin-top:auto;padding-top:24px;font-size:10px;letter-spacing:.22em;text-transform:uppercase;color:var(--gold-dk)}
.li-foot{margin-top:36px;text-align:center}

/* ---------- contact ---------- */
.contact{background:var(--ink-2);color:#F2EFE7;padding:92px 0;border-top:1px solid var(--gold-dk)}
.contact-in{display:grid;grid-template-columns:1.08fr .92fr;gap:80px;align-items:center}
.contact h2{font-size:37px;line-height:1.18;color:#FBF8F1;margin-top:0}
.contact p{color:#BEBAB0;margin-top:20px;font-size:16px;max-width:34em}
.cbox{border:1px solid rgba(192,154,62,.3);padding:36px 40px}
.cbox div{padding:18px 0;border-top:1px solid rgba(255,255,255,.08)}
.cbox div:first-child{border-top:none;padding-top:0}
.cbox div:last-child{padding-bottom:0}
.cbox .k{font-size:9.5px;letter-spacing:.28em;text-transform:uppercase;color:var(--gold-lt);border:none;padding:0;margin-bottom:8px}
.cbox .v{font-family:var(--serif);font-size:22px;color:#FBF8F1}
.cbox .alt-v{border:none;padding:6px 0 0;font-size:11px;letter-spacing:.2em;color:#8E8A81}

/* ---------- footer ---------- */
footer{background:var(--ink);color:#8E8A81;padding:62px 0 38px}
.f-in{display:grid;grid-template-columns:2fr repeat(3,1fr);gap:36px;align-items:start}
.f-brand{display:flex;align-items:center;gap:22px}
.f-brand img{height:124px;display:block;flex:none}
.f-brand .nm{font-family:var(--serif);font-size:22px;color:#EDE9E0;letter-spacing:.02em;line-height:1.15}
.f-brand .sb{font-size:8px;letter-spacing:.17em;text-transform:uppercase;color:var(--gold);margin-top:10px}
.fcol h4{font-family:var(--sans);font-size:10px;letter-spacing:.26em;text-transform:uppercase;color:#EDE9E0;font-weight:400;margin-bottom:16px}
.fcol a{display:block;font-size:13px;color:#8E8A81;padding:6px 0}
.fbot{margin-top:54px;padding-top:24px;border-top:1px solid rgba(255,255,255,.08);display:flex;justify-content:space-between;gap:40px;font-size:11px;color:#6E6B65}
.fbot p{font-size:11px;line-height:1.7;max-width:62em}

/* ---------- interior pages ---------- */
.phero{background:var(--ink);color:#F4F1E9;position:relative;z-index:0;border-bottom:1px solid var(--gold-dk);overflow:hidden}
.phero::before{content:"";position:absolute;inset:22px;border:1px solid rgba(192,154,62,.22);pointer-events:none}
.phero-in{padding:78px 0 74px;position:relative;max-width:920px}
.phero h1{font-size:50px;line-height:1.14;color:#FBF8F1;font-weight:300}
.phero .rule{width:76px;height:1px;background:var(--gold);margin:24px 0 22px}
.phero p{font-size:17px;line-height:1.78;color:#C3BFB5;max-width:40em}
.blk{margin-top:64px}
.blk:first-child{margin-top:0}
.blk h3{font-size:31px;line-height:1.2}
.blk .sd,.sd{font-size:11px;letter-spacing:.24em;text-transform:uppercase;color:var(--gold-dk);margin-bottom:14px;display:block}
.split > div > p{margin-top:16px;color:var(--muted);font-size:16px;line-height:1.75}
.blk p{margin-top:16px;color:var(--muted);font-size:16px;max-width:46em;line-height:1.75}
.listx{list-style:none;margin-top:26px;border-top:1px solid var(--line)}
.listx li{font-size:14.5px;color:#45474A;padding:14px 0 14px 22px;border-bottom:1px solid var(--line);position:relative}
.listx li::before{content:"";position:absolute;left:0;top:21px;width:4px;height:4px;background:var(--gold);transform:rotate(45deg)}
.split{display:grid;grid-template-columns:1fr 1fr;gap:64px;align-items:start}
.split3{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:var(--line);border:1px solid var(--line);margin-top:56px}
.split3 > div{background:var(--card);padding:38px 32px 34px}
.split3 h4{font-family:var(--serif);font-size:24px;font-weight:400}
.split3 .ln{width:24px;height:1px;background:var(--gold);margin:16px 0 14px;opacity:.6}
.split3 p{font-size:14px;color:var(--muted);line-height:1.7}
.grid2{display:grid;grid-template-columns:1fr 1fr;gap:60px;margin-top:56px}
.mini{font-size:11px;letter-spacing:.26em;text-transform:uppercase;color:#8B8D8B;margin-bottom:18px}
.rows div{font-size:13.5px;color:#4A4C4A;padding:13px 0;border-bottom:1px solid var(--line);line-height:1.6}
.rows div:first-child{border-top:1px solid var(--line)}
.rows b{font-weight:400;color:#17191B}
.rows .y{color:var(--gold-dk);font-size:11px;letter-spacing:.14em;float:right;margin-left:18px}
.cite{padding:22px 0;border-bottom:1px solid var(--line);font-size:15px;color:#35373A;line-height:1.7}
.cite em{font-style:italic}
.cite .y{float:right;font-size:10.5px;letter-spacing:.16em;color:var(--gold-dk);margin-left:22px;padding-top:5px}
.cite .n{display:block;font-size:12.5px;color:#7C7E80;margin-top:7px}
/* timeline */
.tl{margin-top:54px}
.tlrow{display:grid;grid-template-columns:120px 30px 1fr}
.tlrow .yr{font-size:10.5px;letter-spacing:.18em;text-transform:uppercase;color:var(--gold-dk);padding:26px 18px 0 0;text-align:right;white-space:nowrap}
.tlrail{position:relative}
.tlrail::before{content:"";position:absolute;left:50%;top:0;bottom:0;width:1px;background:var(--line-2);transform:translateX(-50%)}
.tlrow:first-child .tlrail::before{top:30px}
.tlrow.last .tlrail::before{height:30px;bottom:auto}
.tldot{position:absolute;left:50%;top:30px;width:9px;height:9px;background:var(--paper);border:1px solid var(--gold);transform:translate(-50%,-50%) rotate(45deg);z-index:2}
.tldot.solid{background:var(--gold)}
.tlbody{padding:20px 0 26px 26px}
.tlbody h4{font-family:var(--serif);font-size:23px;font-weight:400;line-height:1.25}
.tlbody .org{font-size:11px;letter-spacing:.18em;text-transform:uppercase;color:var(--gold-dk);margin-top:8px}
.tlbody p{font-size:14px;color:var(--muted);margin-top:11px;line-height:1.72;max-width:46em}
.tlhead{font-family:var(--serif);font-size:15px;letter-spacing:.24em;text-transform:uppercase;color:#8B8D8B;padding:34px 18px 10px 0;text-align:right}
/* pull quote band */
.pull{background:var(--paper-2);padding:76px 0;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.pull .q{font-family:var(--serif);font-size:31px;line-height:1.44;color:#222424;max-width:900px;margin:0 auto;text-align:center}
.pull .a{margin-top:26px;text-align:center;font-size:10.5px;letter-spacing:.24em;text-transform:uppercase;color:#7C7E7C}
.pull .a b{color:var(--gold-dk);font-weight:400}
/* composite blocks */
.band-in{display:grid;grid-template-columns:1.05fr .95fr;gap:78px;align-items:center}
.band-in h2{text-align:left;font-size:46px;color:#FBF8F1;margin-top:0}
.band-in p{color:#BEBAB0;margin-top:20px;font-size:16.5px;line-height:1.75}
.band-note{font-size:13px;color:#949087;margin-top:24px;line-height:1.7;max-width:36em}
.plate{border:1px solid rgba(192,154,62,.35);padding:40px}
.plate .in{border:1px solid rgba(192,154,62,.16);padding:38px 34px;text-align:center}
.plate .mark{font-family:var(--serif);font-size:46px;color:#FBF8F1;line-height:1.1}
.plate .mark span{color:var(--gold)}
.plate .tag{font-size:10px;letter-spacing:.3em;text-transform:uppercase;color:#8E8A81;margin-top:14px}
.plate ul{list-style:none;margin-top:28px;text-align:left}
.plate li{font-size:13.5px;color:#B8B4AA;padding:11px 0;border-top:1px solid rgba(255,255,255,.07)}
.objs{display:grid;grid-template-columns:repeat(3,1fr);gap:36px;margin-top:74px}
.obj{border-top:1px solid rgba(192,154,62,.45);padding-top:20px}
.obj .on{font-family:var(--serif);font-size:15px;color:var(--gold);letter-spacing:.06em}
.obj h3{font-size:22px;color:#FBF8F1;margin-top:8px;line-height:1.25}
.obj p{font-size:13.5px;color:#A5A198;margin-top:12px;line-height:1.7}
.fw{display:grid;grid-template-columns:.88fr 1.12fr;gap:64px;align-items:start}
.fw-list{display:grid;grid-template-columns:1fr 1fr;gap:0 36px;margin-top:34px}
.fw-list div{display:flex;gap:13px;align-items:baseline;padding:13px 0;border-bottom:1px solid var(--line-2)}
.fw-list b{font-family:var(--serif);font-size:16px;color:var(--gold);font-weight:400;min-width:22px}
.fw-list span{font-size:14px;color:#3E403F}
.xwalk{border:1px solid var(--line-2);background:var(--card);overflow:hidden}
.xwalk .cap{display:flex;justify-content:space-between;align-items:baseline;padding:20px 24px;border-bottom:1px solid var(--line-2)}
.xwalk .cap b{font-family:var(--serif);font-size:19px;font-weight:400}
.xwalk .cap span{font-size:9.5px;letter-spacing:.24em;text-transform:uppercase;color:var(--gold-dk)}
table{border-collapse:collapse;width:100%}
th,td{text-align:left;padding:13px 7px;font-size:11px;border-bottom:1px solid var(--line)}
th{font-size:9px;letter-spacing:.16em;text-transform:uppercase;color:#8B8D8B;font-weight:400}
td:first-child,th:first-child{padding-left:20px;color:#2A2C2C}
td:last-child,th:last-child{padding-right:20px}
td.c{color:var(--gold);text-align:center}
td.pol{font-size:10px;letter-spacing:.1em;color:#5F615F;white-space:nowrap}
tbody tr:last-child td{border-bottom:none}

/* ---------- ai practice ---------- */
.deliver{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:var(--line);border:1px solid var(--line);margin-top:56px}
.deliver > div{background:var(--card);padding:36px 32px 34px}
.deliver .n{font-family:var(--serif);font-size:15px;color:var(--gold);letter-spacing:.08em}
.deliver h4{font-family:var(--serif);font-size:24px;font-weight:400;margin-top:10px;line-height:1.2}
.deliver .ln{width:24px;height:1px;background:var(--gold);margin:15px 0 13px;opacity:.6}
.deliver p{font-size:13.5px;color:var(--muted);line-height:1.7}
.checks{list-style:none;margin-top:44px}
.checks li{font-size:15px;color:#BEBAB0;padding:16px 0 16px 24px;border-top:1px solid rgba(255,255,255,.09);position:relative;line-height:1.6}
.checks li:last-child{border-bottom:1px solid rgba(255,255,255,.09)}
.checks li::before{content:"";position:absolute;left:0;top:24px;width:5px;height:5px;background:var(--gold);transform:rotate(45deg)}
.checks b{font-weight:400;color:#FBF8F1}
.engbox{border:1px solid rgba(192,154,62,.35);padding:36px 34px}
.engbox .t{font-family:var(--serif);font-size:22px;color:var(--gold-lt)}
.engbox ul{list-style:none;margin-top:22px}
.engbox li{font-size:13.5px;color:#B8B4AA;padding:12px 0;border-top:1px solid rgba(255,255,255,.08);line-height:1.55}
.lay{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:var(--line);border:1px solid var(--line);margin-top:52px}
.lay > div{background:var(--card);padding:34px 30px 32px}
.lay .n{font-family:var(--serif);font-size:30px;color:var(--gold);line-height:1}
.lay h4{font-family:var(--serif);font-size:23px;font-weight:400;margin-top:12px}
.lay .ln{width:24px;height:1px;background:var(--gold);margin:15px 0 13px;opacity:.6}
.lay p{font-size:13.5px;color:var(--muted);line-height:1.7}
.stdnote{display:flex;align-items:center;gap:40px;margin-top:36px;border:1px solid var(--line-2);background:var(--card);padding:26px 30px}
.stdnote p{font-size:13.5px;color:var(--muted);line-height:1.7;margin:0;max-width:34em}
.badges{display:flex;flex-wrap:wrap;gap:10px;justify-content:flex-end;flex:1}
.badge{border:1px solid var(--line-2);padding:11px 16px;text-align:center;min-width:92px}
.badge b{display:block;font-family:var(--serif);font-size:15px;font-weight:400;color:#1E2022;line-height:1.15}
.badge span{display:block;font-size:8.5px;letter-spacing:.16em;text-transform:uppercase;color:#8B8D8B;margin-top:4px}
.sect{display:grid;grid-template-columns:repeat(6,1fr);padding:0;margin-top:52px}
.sect div{padding:30px 14px;text-align:center;border-left:1px solid rgba(255,255,255,.10)}
.sect div:first-child{border-left:none}
.sect em{font-style:normal;display:block;font-family:var(--serif);font-size:15px;color:var(--gold);margin-bottom:10px}
.sect span{font-size:10px;letter-spacing:.16em;text-transform:uppercase;color:#B8B4AA;line-height:1.6;display:block}
.whyme{display:grid;grid-template-columns:.62fr 1.38fr;gap:56px;align-items:start;margin-top:52px}
.whyme .ph{position:relative;padding:12px}
.whyme .ph .fr{position:absolute;inset:0;border:1px solid var(--line-2)}
.whyme .ph img{width:100%;display:block;position:relative}
.reasons{list-style:none}
.reasons li{font-size:15px;color:var(--muted);padding:17px 0 17px 24px;border-bottom:1px solid var(--line);position:relative;line-height:1.6}
.reasons li:first-child{border-top:1px solid var(--line)}
.reasons li::before{content:"";position:absolute;left:0;top:25px;width:5px;height:5px;background:var(--gold);transform:rotate(45deg)}
.reasons b{font-weight:400;color:#17191B}
.chips{display:flex;flex-wrap:wrap;gap:10px;margin-top:44px;justify-content:center}
.chips span{font-size:10.5px;letter-spacing:.14em;text-transform:uppercase;color:#C6C2B8;border:1px solid rgba(192,154,62,.35);padding:11px 16px}

/* ============================================================
   RESPONSIVE
   ============================================================ */
@media (max-width: 1180px){
  .mast{padding-left:200px}
  .navlinks{padding-left:200px;gap:14px}
  .navlinks a{font-size:10px;letter-spacing:.09em}
  .namewrap .nm{font-size:36px}
  .brand img{height:214px;top:22px}
}
@media (max-width: 980px){
  .wrap{padding:0 32px}
  .mast{height:auto;padding:26px 0 22px 150px}
  .brand{left:8px}
  .brand img{height:150px;top:0}
  .namewrap{text-align:left}
  .namewrap .nm{font-size:28px;white-space:normal}
  .namewrap .sub{white-space:normal;letter-spacing:.2em}
  .navlinks{height:auto;padding:14px 0;flex-wrap:wrap;gap:16px 22px;justify-content:flex-start}
  .hero-in,.band-in,.about,.split,.fw,.contact-in,.whyme{grid-template-columns:1fr;gap:44px}
  .two{grid-template-columns:1fr;gap:44px}
  .vline{display:none}
  .cards,.split3,.deliver,.lay,.layers{grid-template-columns:1fr 1fr}
  .why,.objs,.steps{grid-template-columns:1fr 1fr;gap:30px}
  .steps::before{display:none}
  .strip-in,.vals-in,.sect{grid-template-columns:1fr 1fr}
  .strip-in div:nth-child(odd),.vals-in div:nth-child(odd),.sect div:nth-child(odd){border-left:none}
  .grid2,.cred-grid{grid-template-columns:1fr;gap:44px}
  .photo{max-width:420px;justify-self:start}
  .hero h1{font-size:42px}
  .phero h1{font-size:38px}
  .sec-head h2,.band h2,.about h2,.contact h2,.band-in h2{font-size:34px}
  .f-in{grid-template-columns:1fr 1fr;gap:34px}
  .tlrow{grid-template-columns:78px 22px 1fr}
  .tlrow .yr{font-size:9px;letter-spacing:.1em;white-space:normal}
  .util-in{height:auto;padding:10px 0;flex-wrap:wrap;gap:8px 20px;justify-content:flex-start}
}
@media (max-width: 640px){
  .wrap{padding:0 22px}
  .cards,.split3,.deliver,.lay,.why,.objs,.steps,.strip-in,.vals-in,.sect,.f-in{grid-template-columns:1fr}
  .strip-in div,.vals-in div,.sect div{border-left:none;border-top:1px solid var(--line)}
  .vals-in div,.sect div{border-top-color:rgba(255,255,255,.08)}
  .chain,.fw-list,.creds{grid-template-columns:1fr}
  .hero h1{font-size:34px}
  .namewrap .nm{font-size:23px}
  .brand img{height:120px}
  .mast{padding-left:104px}
  .cta{flex-wrap:wrap}
  .pull .q{font-size:23px}
  .qb .q{font-size:24px}
}

/* interaction — the mockups are static, the site is not */
a{transition:color .18s ease, border-color .18s ease, background-color .18s ease}
.navlinks a:hover,.util .r a:hover,.fcol a:hover{color:var(--gold-dk)}
.util .r a:hover,.fcol a:hover{color:var(--gold-lt)}
.btn:hover{background:var(--gold);border-color:var(--gold);color:#141210}
.btn.solid:hover{background:var(--gold-dk);border-color:var(--gold-dk);color:#FBF8F1}
.btn.ghost-d:hover{background:transparent;border-color:var(--gold);color:#FBF8F1}
.more:hover{color:var(--gold)}
.card:hover,.deliver > div:hover,.lay > div:hover,.split3 > div:hover,.li-card:hover{background:#FFFFFF}
.post:hover{border-color:var(--gold)}
a:focus-visible,button:focus-visible{outline:2px solid var(--gold);outline-offset:3px}
.skip{position:absolute;left:-9999px;top:0;background:var(--gold);color:#141210;padding:12px 18px;z-index:99;font-size:12px;letter-spacing:.18em;text-transform:uppercase}
.skip:focus{left:0}
@media print{.util,.navband,.contact,footer{display:none}body{background:#fff}}