/* Trueform Projects — shared stylesheet
   Tokens taken directly from the approved design source (Trueform *.dc.html). */

:root{
  --ink:#2C2218;
  --paper:#F4F0E8;
  --paper-alt:#EBE4D6;
  --accent:#33261B;
  --line:#E2D8C6;
  --line-soft:rgba(44,34,24,.14);
  --line-soft2:rgba(44,34,24,.16);
  --font-serif:'Cormorant Garamond',serif;
  --font-body:Spectral,serif;
  --font-sans:Archivo,sans-serif;
  --font-mono:ui-monospace,monospace;
}

*{box-sizing:border-box;}
html,body{margin:0;padding:0;max-width:100%;overflow-x:hidden;}
body{
  font-family:var(--font-sans);
  background:var(--paper);
  color:var(--ink);
  background-image:repeating-linear-gradient(135deg, rgba(44,34,24,.025) 0 2px, transparent 2px 5px);
  animation:tfDrift 90s linear infinite;
}
img{display:block;max-width:100%;}
a{text-decoration:none;color:inherit;transition:color 200ms ease,translate 220ms cubic-bezier(.23,1,.32,1),opacity 200ms ease,box-shadow 220ms ease,background-color 220ms ease,border-color 200ms ease;}
a[data-link]{white-space:nowrap;}
a[data-btn]:active{scale:.97;}
a[data-card]:active{scale:.995;}

input,textarea,select{font-family:var(--font-body);font-size:16px;color:var(--ink);background:var(--paper);border:1px solid #DFD4C1;padding:13px 14px;width:100%;transition:border-color 200ms ease,background-color 200ms ease;}
input:focus,textarea:focus,select:focus{outline:none;border-color:var(--accent);background:#FBF9F4;}
textarea{resize:vertical;min-height:120px;}

@keyframes tfDrift{0%{background-position:0 0}100%{background-position:420px 420px}}
@keyframes tfRise{0%{opacity:0;translate:0 22px}100%{opacity:1;translate:0 0}}
@keyframes tfRule{0%{transform:scaleX(0)}100%{transform:scaleX(1)}}

@media (hover:hover) and (pointer:fine){
  a[data-link]:hover{opacity:.58;}
  a[data-btn]:hover{translate:0 -2px;box-shadow:0 10px 22px rgba(44,34,24,.18);}
  a[data-card]:hover{translate:0 -4px;box-shadow:0 16px 34px rgba(44,34,24,.14);}
  a[data-card]:hover img{scale:1.045;}
  a[data-row]:hover{background:var(--paper-alt);}
  a[data-chip]:hover{background:var(--ink);color:var(--paper);border-color:var(--ink);}
}

.tf-reveal{animation:tfRise 800ms cubic-bezier(.23,1,.32,1) both;}
.tf-rule{height:1px;background:var(--line-soft2);transform-origin:left center;animation:tfRule 900ms cubic-bezier(.23,1,.32,1) both;}

/* Utility bar + nav */
.tf-utility{background:var(--ink);color:var(--paper);padding:11px 44px;display:flex;justify-content:space-between;flex-wrap:wrap;gap:12px;font-size:12px;letter-spacing:.08em;}
.tf-utility strong{font-weight:600;}

.tf-nav{display:flex;justify-content:space-between;align-items:center;gap:20px;flex-wrap:wrap;padding:24px 44px;border-bottom:1px solid var(--line);}
.tf-nav-brand{display:flex;align-items:center;gap:14px;min-width:0;flex-shrink:1;}
.tf-nav-brand img.monogram{height:62px;width:auto;flex-shrink:0;}
.tf-nav-brand img.wordmark{height:26px;width:auto;min-width:0;flex-shrink:1;}
.tf-nav-links{display:flex;gap:22px;align-items:center;justify-content:flex-end;flex-wrap:wrap;min-width:0;font-size:12px;letter-spacing:.12em;text-transform:uppercase;}
.tf-nav-links a.is-active{opacity:.55;}
.tf-nav-links a[data-link]{display:inline-flex;align-items:center;min-height:44px;}

/* Buttons */
.tf-btn{display:inline-flex;align-items:center;justify-content:center;white-space:nowrap;font-family:var(--font-sans);font-size:12px;letter-spacing:.14em;text-transform:uppercase;padding:17px 28px;}
.tf-btn--primary{background:var(--ink);color:var(--paper);}
.tf-btn--outline{background:transparent;color:var(--ink);border:1px solid rgba(44,34,24,.35);}
.tf-btn--on-dark{background:var(--paper);color:var(--ink);}
.tf-btn--on-dark-ghost{background:transparent;color:var(--paper);border:1px solid rgba(244,240,232,.4);}
.tf-btn-row{display:flex;gap:14px;align-items:center;flex-wrap:wrap;margin-top:10px;}

/* Hero */
.tf-hero{padding:84px 44px 40px;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,0.85fr);gap:56px;align-items:end;}
.tf-hero--tight{padding-bottom:34px;}
.tf-hero-copy{display:flex;flex-direction:column;gap:22px;}
.tf-hero-copy--about{align-items:stretch;}
.tf-eyebrow{font-family:var(--font-sans);font-size:11px;letter-spacing:.22em;text-transform:uppercase;opacity:.65;}
.tf-h1{font-family:var(--font-serif);font-weight:300;font-size:70px;line-height:1.03;text-wrap:pretty;}
.tf-h2{font-family:var(--font-serif);font-weight:300;font-size:42px;line-height:1.1;text-wrap:pretty;}
.tf-h2--inverse{color:var(--paper);}
.tf-h3{font-family:var(--font-serif);font-size:30px;line-height:1.15;}
.tf-h4{font-family:var(--font-sans);font-size:18px;font-weight:600;letter-spacing:.005em;}
.tf-body{font-family:var(--font-body);font-size:16px;line-height:1.7;opacity:.85;text-wrap:pretty;}
.tf-body-lead{font-family:var(--font-body);font-size:18px;line-height:1.75;opacity:.88;max-width:520px;text-wrap:pretty;}
.tf-meta{font-family:var(--font-mono);font-size:10px;letter-spacing:.12em;text-transform:uppercase;opacity:.7;}

.tf-price-card{display:flex;flex-direction:column;gap:14px;padding:32px;background:var(--paper-alt);border:1px solid var(--line);}
.tf-price-card .tf-h3{margin:0;}

/* Cred / stat strip */
.tf-cred-strip{background:var(--accent);color:var(--paper);padding:20px 44px;display:flex;justify-content:space-between;flex-wrap:wrap;gap:14px;font-size:14px;}

/* Sections */
.tf-section{padding:80px 44px;display:flex;flex-direction:column;gap:38px;}
.tf-section--alt{background:var(--paper-alt);}
.tf-section-head{display:flex;flex-direction:column;gap:10px;}
.tf-section-head-row{display:flex;justify-content:space-between;align-items:baseline;flex-wrap:wrap;gap:12px;}
.tf-section-head-row .tf-italic{font-family:var(--font-body);font-style:italic;font-size:15px;opacity:.7;}

/* Grids */
.tf-grid-4{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:22px;}
.tf-grid-3{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:22px;}
.tf-grid-2{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:22px;}
.tf-grid-about{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,0.95fr);gap:56px;align-items:center;}
.tf-grid-70-30{display:grid;grid-template-columns:minmax(0,0.8fr) minmax(0,1fr);gap:56px;align-items:start;}
.tf-grid-service{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:56px;align-items:start;}
.tf-grid-contact{display:grid;grid-template-columns:minmax(0,0.95fr) minmax(0,1.05fr);gap:60px;align-items:start;}

/* Cards / step tiles */
.tf-card{display:flex;flex-direction:column;gap:14px;padding:30px;background:var(--paper);border:1px solid var(--line);}
.tf-card .tf-step-mark{font-family:var(--font-serif);font-size:34px;line-height:1;color:var(--accent);}
.tf-card .tf-step-name{font-size:18px;font-weight:600;}

/* Project / post cards */
.tf-project-card{display:flex;flex-direction:column;gap:12px;color:var(--ink);}
.tf-project-card .tf-frame{overflow:hidden;}
.tf-project-card img{width:100%;height:280px;object-fit:cover;transition:scale 620ms cubic-bezier(.23,1,.32,1);}
.tf-project-card .tf-project-head{display:flex;justify-content:space-between;align-items:baseline;gap:12px;padding-top:10px;border-top:1px solid var(--line);}
.tf-project-card .tf-project-head span:first-child{font-size:18px;font-weight:600;}

.tf-post-card{display:flex;flex-direction:column;gap:14px;background:var(--paper);border:1px solid var(--line);color:var(--ink);}
.tf-post-card .tf-frame{overflow:hidden;}
.tf-post-card img{width:100%;height:220px;object-fit:cover;transition:scale 620ms cubic-bezier(.23,1,.32,1);}
.tf-post-card .tf-post-body{padding:6px 24px 26px;display:flex;flex-direction:column;gap:12px;}
.tf-post-card .tf-post-title{font-family:var(--font-serif);font-size:28px;line-height:1.12;text-wrap:pretty;}

.tf-featured{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,0.9fr);border:1px solid var(--line);background:var(--paper);color:var(--ink);}
.tf-featured .tf-frame{overflow:hidden;}
.tf-featured img{width:100%;height:460px;object-fit:cover;transition:scale 620ms cubic-bezier(.23,1,.32,1);}
.tf-featured-body{padding:44px;display:flex;flex-direction:column;gap:18px;justify-content:center;}
.tf-featured-title{font-family:var(--font-serif);font-weight:300;font-size:44px;line-height:1.06;text-wrap:pretty;}
.tf-featured-link{font-size:12px;letter-spacing:.14em;text-transform:uppercase;box-shadow:inset 0 -1px 0 var(--accent);align-self:flex-start;padding-bottom:3px;margin-top:6px;}

.tf-archive-row{display:grid;grid-template-columns:110px minmax(0,1fr) auto;gap:22px;align-items:baseline;padding:18px 12px;margin:0 -12px;border-bottom:1px solid var(--line);color:var(--ink);}

/* FAQ rows */
.tf-faq-row{padding:22px 0;border-bottom:1px solid var(--line-soft);display:flex;flex-direction:column;gap:8px;}
.tf-faq-row .tf-h4{font-size:18px;}

/* Detail rows (contact/about credentials) */
.tf-detail-row{display:flex;justify-content:space-between;gap:20px;padding:18px 0;border-bottom:1px solid var(--line);}
.tf-detail-row .tf-k{font-size:11px;letter-spacing:.2em;text-transform:uppercase;opacity:.6;}
.tf-detail-row .tf-v{font-family:var(--font-body);font-size:16px;text-align:right;min-width:0;}
.tf-credential-row{display:flex;justify-content:space-between;gap:20px;padding:20px 0;border-bottom:1px solid var(--line-soft);}
.tf-credential-row .tf-k{font-size:15px;font-weight:600;flex-shrink:0;}
.tf-credential-row .tf-v{font-family:var(--font-body);font-size:16px;opacity:.85;text-align:right;min-width:0;}
.tf-credentials-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0 56px;}

/* Chips */
.tf-chip-row{display:flex;flex-wrap:wrap;gap:8px;margin-top:6px;}
.tf-chip{border:1px solid #D8CDB9;padding:10px 16px;font-size:12px;letter-spacing:.1em;text-transform:uppercase;}
.tf-suburb-chip{border:1px solid #D8CDB9;padding:9px 15px;font-size:13px;display:inline-block;}

/* Before/after pairs */
.tf-pair{display:flex;flex-direction:column;gap:10px;}
.tf-pair-imgs{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:4px;}
.tf-pair-imgs > div{position:relative;}
.tf-pair-imgs img{width:100%;height:320px;object-fit:cover;}
.tf-pair-tag{position:absolute;top:0;left:0;color:var(--paper);padding:6px 12px;font-size:10px;letter-spacing:.16em;text-transform:uppercase;}
.tf-pair-tag--a{background:var(--ink);}
.tf-pair-tag--b{background:var(--accent);}
.tf-pair-caption{display:flex;flex-direction:column;gap:6px;padding-top:10px;border-top:1px solid var(--line-soft);}
.tf-pair-caption .tf-name{font-size:18px;font-weight:600;}

/* Service block */
.tf-service{padding:80px 44px;display:flex;flex-direction:column;gap:38px;border-bottom:1px solid var(--line);}
.tf-service-no{font-family:var(--font-serif);font-size:30px;line-height:1;color:var(--accent);}
.tf-service-title{font-family:var(--font-serif);font-weight:300;font-size:48px;line-height:1.06;}
.tf-service-meta{display:flex;flex-direction:column;gap:2px;margin-top:6px;}
.tf-service-meta .tf-k{font-size:11px;letter-spacing:.2em;text-transform:uppercase;opacity:.6;}
.tf-service-meta .tf-v{font-family:var(--font-body);font-size:17px;}
.tf-service-img{width:100%;height:340px;object-fit:cover;}
.tf-service-items{display:flex;flex-direction:column;}
.tf-service-item{display:flex;gap:14px;align-items:baseline;padding:13px 0;border-bottom:1px solid var(--line);}
.tf-service-item .tf-dot{width:5px;height:5px;border-radius:50%;background:var(--accent);flex:0 0 auto;}
.tf-service-item span:last-child{font-family:var(--font-body);font-size:16px;line-height:1.6;}

/* CTA band */
.tf-cta-band{background:var(--accent);color:var(--paper);padding:68px 44px;display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:22px;}
.tf-cta-band .tf-h2--inverse{max-width:620px;}
.tf-cta-band--grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,0.8fr);gap:40px;align-items:center;}

/* Contact form panel */
.tf-form-panel{background:var(--paper-alt);border:1px solid var(--line);padding:40px;display:flex;flex-direction:column;gap:20px;}
.tf-form-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px;}
.tf-field{display:flex;flex-direction:column;gap:7px;}
.tf-field label{font-size:11px;letter-spacing:.14em;text-transform:uppercase;opacity:.65;}
.tf-span-2{grid-column:span 2;}
.tf-form-note{font-family:var(--font-body);font-size:13px;opacity:.7;}

/* Footer */
.tf-footer{background:var(--ink);color:var(--paper);padding:44px;display:flex;justify-content:space-between;flex-wrap:wrap;gap:20px;font-family:var(--font-body);font-size:15px;}
.tf-footer-brand{font-family:var(--font-serif);font-size:16px;letter-spacing:.3em;text-transform:uppercase;color:var(--paper);}

/* Image treatments used across pages */
.tf-img-cover{width:100%;object-fit:cover;display:block;}

/* Responsive */
@media (max-width:900px){
  .tf-utility{padding:10px 20px;font-size:11px;}
  .tf-nav{padding:18px 20px;}
  .tf-nav-brand img.monogram{height:44px;}
  .tf-hero,.tf-section,.tf-section--alt,.tf-cta-band,.tf-cred-strip,.tf-grid-about,.tf-service{padding-left:20px;padding-right:20px;}
  .tf-hero{grid-template-columns:1fr;padding-top:48px;gap:32px;}
  .tf-h1{font-size:44px;max-width:100%;}
  .tf-h2{font-size:32px;}
  .tf-featured-title{font-size:32px;}
  .tf-grid-4,.tf-grid-3,.tf-grid-2,.tf-grid-about,.tf-grid-70-30,.tf-grid-service,.tf-grid-contact,.tf-featured,.tf-cta-band--grid,.tf-pair-imgs{grid-template-columns:1fr;}
  .tf-form-grid{grid-template-columns:1fr;}
  .tf-span-2{grid-column:span 1;}
  .tf-cta-band{padding:44px 20px;}
  .tf-footer{padding:32px 20px;}
  .tf-archive-row{grid-template-columns:1fr;gap:6px;}
  .tf-credentials-grid{grid-template-columns:1fr;gap:0;}
  .tf-chip{padding:13px 16px;}
}
