/* ayestyfeel.com: scattered index cards on a white table */
:root{
  --sheet:#FFFFFF;
  --stock:#FFFCF5;
  --amber:#C9862E;
  --teal:#1F6E6A;
  --brick:#A6432E;
  --violet:#5B4E8E;
  --ink:#201E1C;
  --ink-soft:#57514B;
  --rule:#E6E1D8;
  --drop:0 1px 0 rgba(32,30,28,.05),0 3px 6px -2px rgba(32,30,28,.10),0 18px 30px -16px rgba(32,30,28,.32);
  --drop-up:0 1px 0 rgba(32,30,28,.04),0 10px 16px -8px rgba(32,30,28,.16),0 34px 50px -26px rgba(32,30,28,.36);
  --lean:1.7deg;
  --face:"Fraunces",Georgia,serif;
  --text:"Inter",system-ui,-apple-system,sans-serif;
  --page:1160px;
  --edge:32px;
}
*,*::before,*::after{box-sizing:border-box}
body{margin:0;background:var(--sheet);color:var(--ink);font:400 1.0625rem/1.68 var(--text);overflow-x:hidden;-webkit-text-size-adjust:100%}
h1,h2,h3{font-family:var(--face);font-weight:500;font-variation-settings:"SOFT" 100;line-height:1.1;margin:0;letter-spacing:-.015em}
p{margin:0 0 1.05em}
a{color:inherit}
svg{display:block}
:focus-visible{outline:2px dashed var(--brick);outline-offset:4px}
.nc-jump{position:absolute;left:-9999px;top:10px;padding:8px 14px;background:var(--ink);color:#fff;z-index:40}
.nc-jump:focus{left:14px}
.nc-page{max-width:var(--page);margin:0 auto;padding:0 var(--edge)}
.nc-kick{font-family:var(--face);font-style:italic;font-size:1.02rem;color:var(--ink-soft);margin:0 0 14px}

/* ---- header ---- */
.nc-bar{background:var(--sheet);border-bottom:1px solid var(--rule);position:relative;z-index:30}
.nc-bar .nc-page{display:flex;align-items:center;justify-content:space-between;gap:20px;height:72px}
.nc-logo{display:inline-flex;align-items:center;gap:11px;text-decoration:none}
.nc-logo svg{width:32px;height:32px}
.nc-logo span{font-family:var(--face);font-size:1.32rem;font-variation-settings:"SOFT" 100}
.nc-links ul{display:flex;gap:28px;list-style:none;margin:0;padding:0}
.nc-links a{position:relative;display:inline-block;padding:5px 1px;text-decoration:none;font-size:.94rem;font-weight:500}
.nc-links a::after{content:"";position:absolute;left:0;right:0;bottom:-1px;height:2px;border-radius:1px;background:var(--hue,var(--teal));transform-origin:left center;transform:scaleX(0)}
.nc-links a:hover::after,.nc-links a:focus-visible::after,.nc-links a[aria-current="page"]::after{animation:nc-settle .5s cubic-bezier(.34,1.5,.55,1) forwards}
@keyframes nc-settle{0%{transform:rotate(-8deg) scaleX(.3)}60%{transform:rotate(2.5deg) scaleX(1.03)}100%{transform:rotate(0) scaleX(1)}}
.nc-burger{display:none;width:44px;height:44px;border:1px solid var(--rule);border-radius:10px;background:var(--sheet);cursor:pointer;padding:0;place-items:center}
.nc-burger i{display:block;width:18px;height:2px;background:var(--ink);box-shadow:0 -6px 0 var(--ink),0 6px 0 var(--ink)}

/* ---- the card itself ---- */
.nc-card{position:relative;transform:rotate(var(--turn,0deg));box-shadow:var(--drop);transition:transform .4s cubic-bezier(.22,.9,.32,1.2),box-shadow .4s ease}
.nc-card:hover,.nc-card:focus-within{transform:rotate(0) translateY(-4px);box-shadow:var(--drop-up)}
.nc-ccw{--turn:calc(var(--lean) * -1)}
.nc-cw{--turn:var(--lean)}

/* ---- home: opening ---- */
.nc-open{padding:70px 0 100px}
.nc-open h1{font-size:clamp(2.5rem,6.2vw,5rem);max-width:13.5em}
.nc-open h1 span{color:var(--brick);font-style:italic}
.nc-open-row{display:grid;grid-template-columns:minmax(0,7fr) minmax(0,5fr);gap:64px;align-items:start;margin-top:52px}
.nc-pile{position:relative;padding:22px 26px 30px}
.nc-pile::before,.nc-pile::after{content:"";position:absolute;inset:22px 26px 30px;border-radius:5px;box-shadow:var(--drop)}
.nc-pile::before{background:var(--teal);transform:rotate(-4.5deg) translate(-10px,6px)}
.nc-pile::after{background:var(--amber);transform:rotate(3.5deg) translate(12px,4px)}
.nc-shot{z-index:1;margin:0;background:var(--stock);border-radius:5px;padding:12px;--turn:1.4deg}
.nc-shot-frame{aspect-ratio:3/2;overflow:hidden;border-radius:3px;background:#201E1C}
.nc-shot-frame img{display:block;width:100%;height:100%;object-fit:cover;object-position:center}
.nc-lede{font-size:1.2rem;line-height:1.6;color:var(--ink-soft);margin:6px 0 30px}
.nc-contents{list-style:none;margin:0;padding:0;border-top:1px solid var(--ink)}
.nc-contents li{border-bottom:1px solid var(--rule)}
.nc-contents a{display:grid;grid-template-columns:14px 1fr auto;align-items:center;gap:14px;padding:14px 2px;text-decoration:none;font-weight:500;transition:padding .25s}
.nc-contents a:hover,.nc-contents a:focus-visible{padding-left:8px}
.nc-contents i{width:12px;height:9px;border-radius:2px;background:var(--hue);transform:rotate(-9deg)}
.nc-contents em{font-family:var(--face);font-style:normal;color:var(--ink-soft)}

/* ---- home: four piles ---- */
.nc-suits{padding:0 0 110px}
.nc-suits-head{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:40px;align-items:end;margin-bottom:56px}
.nc-suits-head h2{font-size:clamp(2rem,3.6vw,2.8rem)}
.nc-suits-head p{margin:0;color:var(--ink-soft)}
.nc-suit-grid{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:56px 64px}
.nc-suit{border-radius:5px;padding:26px 30px 24px;min-height:280px;display:grid;grid-template-columns:1fr auto;grid-template-rows:auto 1fr auto;column-gap:20px;color:#fff;--lean:2.2deg}
.nc-suit:nth-child(3),.nc-suit:nth-child(4){--lean:1.4deg}
.nc-suit[data-hue="amber"]{background:var(--amber);color:var(--ink)}
.nc-suit[data-hue="teal"]{background:var(--teal)}
.nc-suit[data-hue="brick"]{background:var(--brick)}
.nc-suit[data-hue="violet"]{background:var(--violet)}
.nc-suit h3{font-size:2rem;grid-column:1}
.nc-suit p{grid-column:1/-1;margin:14px 0 18px;max-width:30em;font-size:.98rem;line-height:1.58}
.nc-suit-n{grid-column:2;grid-row:1;font-family:var(--face);font-size:3.2rem;line-height:.9;font-variation-settings:"SOFT" 100,"opsz" 144;opacity:.9}
.nc-suit-foot{grid-column:1/-1;display:flex;justify-content:space-between;align-items:center;gap:10px;padding-top:14px;border-top:1.5px solid currentColor;font-size:.9rem}
.nc-suit-foot a{font-weight:600;text-decoration:none}
.nc-suit-foot a::after{content:"";position:absolute;inset:0;border-radius:5px}
.nc-suit-foot a span{border-bottom:1.5px solid currentColor}

/* ---- home: method (flat) ---- */
.nc-method{padding:0 0 110px}
.nc-flat{display:grid;grid-template-columns:minmax(0,4fr) minmax(0,7fr);gap:56px;border:1px solid var(--rule);border-radius:12px;padding:46px 50px}
.nc-flat h2{font-size:1.9rem;margin-bottom:12px}
.nc-flat > div > p{color:var(--ink-soft);margin:0}
.nc-rules{list-style:none;margin:0;padding:0}
.nc-rules li{display:grid;grid-template-columns:52px 1fr;gap:14px;padding:18px 0;border-top:1px solid var(--rule)}
.nc-rules li:first-child{border-top:0;padding-top:0}
.nc-rules b{font-family:var(--face);font-weight:500;font-size:2.2rem;line-height:1;color:var(--hue)}
.nc-rules strong{display:block;font-weight:600;margin-bottom:4px}
.nc-rules p{margin:0;color:var(--ink-soft);font-size:.97rem}

/* ---- category page ---- */
.nc-head{padding:60px 0 58px}
.nc-head .nc-page{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:40px;align-items:end}
.nc-trail{font-size:.86rem;color:var(--ink-soft);margin:0 0 16px}
.nc-trail a{text-decoration:none;border-bottom:1px solid var(--rule)}
.nc-head h1{font-size:clamp(2.6rem,6vw,4.6rem)}
.nc-head .nc-lede{max-width:34em;margin:16px 0 0}
.nc-jumps{display:flex;flex-wrap:wrap;gap:8px 20px;margin-top:24px;font-size:.9rem}
.nc-jumps a{text-decoration:none;border-bottom:1.5px solid var(--hue)}
.nc-mini{position:relative;width:146px;height:106px}
.nc-mini i{position:absolute;inset:12px 18px;border-radius:4px;box-shadow:var(--drop)}
.nc-mini i:nth-child(1){background:var(--alt1);transform:rotate(8deg) translate(14px,-4px)}
.nc-mini i:nth-child(2){background:var(--alt2);transform:rotate(-7deg) translate(-12px,6px)}
.nc-mini i:nth-child(3){background:var(--stock);border:1px solid var(--rule);transform:rotate(-1.5deg);display:grid;place-items:center;font:500 2rem var(--face);font-style:normal;color:var(--hue)}
.nc-photo-row{padding:0 0 72px}
.nc-photo-row .nc-pile{max-width:800px;margin:0 auto}

.nc-table{padding:16px 0 120px}
.nc-spread{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:80px 72px;align-items:start}
.nc-slot{position:relative;z-index:0}
.nc-slot::before{content:"";position:absolute;inset:0;border-radius:5px;background:var(--hue);box-shadow:var(--drop);transform:rotate(var(--under)) translate(7px,9px);z-index:-1;transition:transform .4s cubic-bezier(.22,.9,.32,1.2)}
.nc-slot:nth-child(odd){--under:2.3deg}
.nc-slot:nth-child(even){--under:-2.5deg;margin-top:46px}
.nc-slot:hover::before,.nc-slot:focus-within::before{transform:rotate(calc(var(--under) * 1.3)) translate(9px,12px)}
.nc-entry{background:var(--stock);border:1px solid var(--rule);border-radius:5px;padding:28px 34px 28px;scroll-margin-top:28px}
.nc-where{display:flex;align-items:center;gap:9px;margin:0 0 6px;font-size:.9rem;color:var(--ink-soft)}
.nc-where::before{content:"";width:11px;height:8px;border-radius:2px;background:var(--hue);transform:rotate(-10deg)}
.nc-entry h2{font-size:1.9rem;margin:0 0 18px;padding-bottom:16px;border-bottom:1.5px solid var(--hue)}
.nc-feats{display:flex;flex-wrap:wrap;gap:7px;list-style:none;margin:22px 0 0;padding:0}
.nc-feats li{font-size:.8rem;font-weight:500;padding:3px 10px;border:1px solid var(--hue);border-radius:3px}

/* art: opening card runs the full width, text set in two columns */
.nc-feature .nc-slot:first-child{grid-column:1/-1;--under:1.2deg}
.nc-feature .nc-slot:first-child .nc-entry{--lean:.9deg;padding:36px 44px}
.nc-feature .nc-slot:first-child .nc-entry h2{font-size:2.5rem}
.nc-feature .nc-slot:first-child .nc-prose{column-count:2;column-gap:44px}
.nc-feature .nc-slot:first-child .nc-prose p{break-inside:avoid}
.nc-feature .nc-slot:nth-child(2){margin-top:0}
.nc-feature .nc-slot:nth-child(3){margin-top:46px}

/* capsule: a coloured band carries the one-line summary */
.nc-slips .nc-entry{padding-top:0;overflow:hidden}
.nc-band{margin:0 -34px 24px;padding:22px 34px 18px;background:var(--hue);color:#fff}
.nc-band q{display:block;font-family:var(--face);font-style:italic;font-size:1.55rem;line-height:1.2;quotes:none}

/* casino: run-in leads */
.nc-runin .nc-run{padding-left:16px;border-left:2px solid var(--rule)}
.nc-run em{font-family:var(--face);font-style:italic;font-weight:500;color:var(--hue);margin-right:4px;font-size:1.06em}

/* ice: one wide card, flat note beside it */
.nc-solo .nc-spread{grid-template-columns:minmax(0,1.7fr) minmax(0,1fr)}
.nc-aside{border:1px solid var(--rule);border-radius:12px;padding:28px 30px;background:var(--sheet)}
.nc-aside h2{font-size:1.35rem;margin-bottom:12px}
.nc-aside p{font-size:.96rem;color:var(--ink-soft)}
.nc-aside p:last-child{margin:0}

.hue-amber{--hue:var(--amber);--alt1:var(--teal);--alt2:var(--violet)}
.hue-teal{--hue:var(--teal);--alt1:var(--amber);--alt2:var(--brick)}
.hue-brick{--hue:var(--brick);--alt1:var(--violet);--alt2:var(--amber)}
.hue-violet{--hue:var(--violet);--alt1:var(--brick);--alt2:var(--teal)}

/* ---- long-form ---- */
.nc-doc{padding:60px 0 120px}
.nc-doc .nc-page{max-width:780px}
.nc-doc h1{font-size:clamp(2.4rem,5vw,3.6rem);margin-bottom:12px}
.nc-doc .nc-lede{padding-bottom:26px;margin-bottom:36px;border-bottom:1px solid var(--rule)}
.nc-doc h2{font-size:1.4rem;margin:38px 0 10px}
.nc-doc a{color:var(--teal);text-underline-offset:3px}
.nc-doc ul{padding-left:1.15em}
.nc-doc li{margin-bottom:.4em}
.nc-clauses{counter-reset:cl;list-style:none;padding:0;margin:0}
.nc-clauses li{counter-increment:cl;display:grid;grid-template-columns:44px 1fr;gap:10px;padding:20px 0;border-top:1px solid var(--rule);margin:0}
.nc-clauses li::before{content:counter(cl);font:500 1.7rem/1 var(--face);color:var(--brick)}
.nc-clauses strong{display:block;margin-bottom:4px}
.nc-clauses p{margin:0}
.nc-mail{display:inline-block;font-family:var(--face);font-size:1.6rem;margin:4px 0 8px}
.nc-stamp{margin-top:46px;font-size:.9rem;color:var(--ink-soft);font-style:italic;font-family:var(--face)}

/* ---- footer (flat) ---- */
.nc-foot{background:var(--teal);color:#fff;padding:68px 0 30px}
.nc-foot-grid{display:grid;grid-template-columns:minmax(0,1.7fr) minmax(0,1fr) minmax(0,1fr);gap:46px;padding-bottom:40px;border-bottom:1px solid rgba(255,255,255,.3)}
.nc-foot-name{display:flex;align-items:center;gap:11px;font-family:var(--face);font-size:1.4rem;margin-bottom:14px}
.nc-foot-name svg{width:32px;height:32px}
.nc-foot p{font-size:.96rem;color:rgba(255,255,255,.88);max-width:28em}
.nc-foot h2{font:italic 500 1.05rem var(--face);margin-bottom:14px;color:rgba(255,255,255,.8)}
.nc-foot ul{list-style:none;margin:0;padding:0}
.nc-foot li{margin-bottom:8px}
.nc-foot a{text-decoration:none;font-size:.96rem;border-bottom:1px solid transparent;transition:border-color .2s}
.nc-foot a:hover,.nc-foot a:focus-visible{border-color:#fff}
.nc-last{display:flex;flex-wrap:wrap;justify-content:space-between;gap:10px;padding-top:22px;font-size:.86rem;color:rgba(255,255,255,.82)}

/* ---- narrower screens ---- */
@media (max-width:1020px){
  .nc-open-row{grid-template-columns:1fr;gap:40px}
  .nc-flat{grid-template-columns:1fr;gap:28px}
}
@media (max-width:820px){
  :root{--edge:20px;--lean:1deg}
  .nc-burger{display:grid}
  .nc-links{display:none;position:absolute;top:100%;left:0;right:0;background:var(--sheet);border-bottom:1px solid var(--rule);box-shadow:0 20px 30px -26px rgba(32,30,28,.5)}
  .nc-links.is-open{display:block}
  .nc-links ul{flex-direction:column;gap:0;padding:6px var(--edge) 16px}
  .nc-links li{border-bottom:1px solid var(--rule)}
  .nc-links a{display:block;padding:14px 0;font-size:1.04rem}
  .nc-links a::after{right:auto;width:56px;bottom:9px}
  .nc-suits-head{grid-template-columns:1fr;gap:12px}
  .nc-suit-grid{grid-template-columns:1fr;gap:40px}
  .nc-suit{min-height:0}
  .nc-spread,.nc-solo .nc-spread{grid-template-columns:1fr;gap:54px}
  .nc-slot:nth-child(even),.nc-feature .nc-slot:nth-child(3){margin-top:0}
  .nc-feature .nc-slot:first-child .nc-prose{column-count:1}
  .nc-feature .nc-slot:first-child .nc-entry{padding:28px 26px}
  .nc-feature .nc-slot:first-child .nc-entry h2{font-size:2rem}
  .nc-head .nc-page{grid-template-columns:1fr}
  .nc-mini{display:none}
  .nc-foot-grid{grid-template-columns:1fr 1fr}
  .nc-foot-grid > div:first-child{grid-column:1/-1}
}
@media (max-width:560px){
  body{font-size:1rem}
  .nc-open{padding:44px 0 72px}
  .nc-entry{padding:24px 22px}
  .nc-band{margin:0 -22px 22px;padding:18px 22px 16px}
  .nc-flat{padding:30px 22px}
  .nc-pile{padding:16px 10px 20px}
  .nc-pile::before,.nc-pile::after{inset:16px 10px 20px}
  .nc-pile::before{transform:rotate(-3deg) translate(-4px,5px)}
  .nc-pile::after{transform:rotate(2.5deg) translate(4px,3px)}
  .nc-slot:nth-child(odd){--under:1.2deg}
  .nc-slot:nth-child(even){--under:-1.2deg}
  .nc-slot::before,.nc-slot:hover::before,.nc-slot:focus-within::before{transform:rotate(var(--under)) translate(3px,7px)}
}
@media (prefers-reduced-motion:reduce){
  .nc-card,.nc-slot::before,.nc-contents a{transition:none}
  .nc-links a:hover::after,.nc-links a:focus-visible::after,.nc-links a[aria-current="page"]::after{animation:none;transform:none}
}
