/* TvojaMajica.si v12 — zrelejši, uredniški oblikovni sistem */
:root{
  --pap:#F7F4EE;
  --sur:#FFFFFF;
  --ink:#1B1B22;
  --txt:#34323A;
  --mut:#716D75;
  --cor:#C74E2D;
  --cor-d:#9F371F;
  --sun:#D99A35;
  --sun-d:#B8781F;
  --line:#E5DED4;
  --rose:#F4E4DC;
  --butter:#F3EBDD;
  --mint:#E4ECE7;
  --sky:#E7EDF0;
  --lilac:#ECE8ED;
}

html{scroll-padding-top:88px}
body{color:var(--txt);background:#fff;font-size:16px;line-height:1.66}
.tm-c{max-width:1180px}
h1,h2,h3{letter-spacing:-.025em}

/* Gumbi: brez otroškega 3D-učinka. */
.tm-btn{
  min-height:48px;
  padding:13px 24px;
  border-radius:11px;
  background:var(--cor);
  box-shadow:0 12px 28px -18px rgba(159,55,31,.7);
  letter-spacing:0;
  transition:background .18s,transform .18s,box-shadow .18s;
}
.tm-btn:hover{background:var(--cor-d);transform:translateY(-1px);box-shadow:0 16px 30px -18px rgba(159,55,31,.75)}
.tm-btn:active{transform:translateY(0);box-shadow:none}
.tm-btn:after{content:"→"}
.tm-btn-ghost{background:#fff;color:var(--ink);border:1px solid var(--line);box-shadow:none}
.tm-btn-ghost:hover{background:var(--ink);border-color:var(--ink);color:#fff}

/* Oznake in poudarki. */
.tm-eyebrow{
  padding:0;
  border-radius:0;
  background:transparent;
  color:var(--cor);
  font-size:12px;
  letter-spacing:.15em;
}
.tm-eyebrow:before{content:"";width:28px;height:1px;background:currentColor}
em.mark{color:var(--cor);white-space:normal}
em.mark:after{left:0;right:0;bottom:-.06em;height:2px;background:currentColor;border-radius:0}

/* Glava in sodoben besedni znak. */
.tm-header{background:rgba(255,255,255,.94);border-bottom:1px solid var(--line);box-shadow:0 8px 30px -28px rgba(27,27,34,.55)}
.tm-nav{height:76px;gap:28px}
.tm-wordmark{display:inline-flex;align-items:baseline;color:var(--ink);font-family:var(--disp);font-size:21px;font-weight:500;letter-spacing:-.045em;white-space:nowrap}
.tm-wordmark b{font-weight:800}
.tm-wordmark em{margin-left:3px;color:var(--cor);font-size:12px;font-style:normal;font-weight:800;letter-spacing:.02em}
.tm-menu{gap:25px}
.tm-menu a{font-size:14.5px;font-weight:650}
.tm-menu a:not(.tm-btn):after{height:1px;bottom:-8px}
.tm-menu .tm-btn{min-height:44px;padding:11px 20px;border-radius:10px;color:#fff}

/* Hero in pas z motivi. */
.tm-hero{background:linear-gradient(135deg,#FAF8F4 0%,#F4EEE5 100%);padding-top:clamp(54px,6vw,86px)}
.tm-hero:before,.tm-phero:before{opacity:.36}
.tm-hero-sales .tm-hero-heading{max-width:980px}
.tm-hero-sales .tm-hero-heading h1{max-width:none}
.tm-hero h1{font-size:clamp(44px,6.1vw,72px);line-height:.96}
.tm-hero-kicker span,.tm-hero-proof span{
  border:1px solid var(--line)!important;
  background:rgba(255,255,255,.76)!important;
  color:var(--txt)!important;
  box-shadow:none!important;
  border-radius:999px!important;
}
.tm-hero-offer{background:rgba(255,255,255,.82)!important;border:1px solid var(--line)!important;border-radius:16px!important;box-shadow:0 22px 55px -44px rgba(27,27,34,.5)!important}
.tm-hero-product{border-radius:20px!important;box-shadow:0 30px 70px -44px rgba(27,27,34,.65)!important}
.tm-hero-photo-badge{background:rgba(27,27,34,.9)!important;color:#fff!important;border:0!important;border-radius:10px!important;transform:none!important}
.tm-marq{transform:none;background:var(--ink);padding:11px 0}
.tm-marq span{font-size:12px;letter-spacing:.14em;color:#D5D0C8!important;padding:0 16px}
.tm-marq span:nth-child(even){color:var(--cor)!important}

/* Sekcije in podstrani. */
section.tm-sec{padding:clamp(64px,7vw,96px) 0}
.tm-sec-alt{background:var(--pap)}
.tm-sec h2{font-size:clamp(31px,4vw,48px);line-height:1.02}
.tm-sec .tm-sub{font-size:17px}
.tm-phero{background:linear-gradient(135deg,#F8F5EF,#F2ECE4);padding:clamp(54px,6vw,80px) 0}
.tm-phero:after{background:radial-gradient(circle,rgba(199,78,45,.11),transparent 64%)}
.tm-phero h1{font-size:clamp(38px,5vw,58px);max-width:19ch}
.tm-crumbs{padding:5px 12px;border-radius:8px;background:rgba(255,255,255,.66)}

/* Kartice: enoten, miren sistem brez rotacij in nalepk. */
.tm-card,.tm-korak,.tm-ideja,.tm-paket,a.tm-hub-card,.tm-faq details{
  border:1px solid var(--line);
  border-radius:16px;
  box-shadow:0 18px 45px -42px rgba(27,27,34,.65);
}
.tm-card:hover,.tm-korak:hover,.tm-ideja:hover,.tm-ideja:nth-child(odd):hover,.tm-ideja:nth-child(even):hover,.tm-paket:hover,a.tm-hub-card:hover{
  transform:translateY(-3px);
  box-shadow:0 24px 46px -34px rgba(27,27,34,.35);
}
.tm-ideja:nth-child(odd),.tm-ideja:nth-child(even){transform:none}
.tm-ideja:before{top:18px;left:auto;right:20px;background:transparent;color:var(--cor);box-shadow:none;padding:0;font-size:12px}
.tm-card .ic{width:48px;height:48px;border-radius:12px;font-size:22px;background:var(--pap)!important}
a.tm-hub-card:nth-child(n){background:#fff}
.tm-hub-card .ic{font-size:25px}
.tm-koraki:before{border-top:1px solid var(--line)}
.tm-korak .n{width:42px;height:42px;background:var(--ink);color:#fff;box-shadow:none;font-size:16px}

/* Cenik in kalkulator. */
.tm-paket{padding:32px 28px}
.tm-paket.izpostavljen{background:var(--ink);border-color:var(--ink);box-shadow:0 28px 60px -40px rgba(27,27,34,.8)}
.tm-paket.izpostavljen:before{content:"PRIPOROČENO";top:18px;right:18px;transform:none;background:rgba(255,255,255,.1);color:#fff;box-shadow:none;border-radius:8px}
.tm-cena-znesek{font-size:44px}
.tm-kol-tab{border:1px solid var(--line)!important;border-radius:14px!important;overflow:hidden;background:#fff}
.tm-kol-tab th{background:#F2EEE8!important;color:var(--ink)!important}
.tm-kol-tab tr.hit td{background:#F6EEE8!important}
.tm-info-pill{border:1px solid var(--line)!important;border-radius:12px!important;background:#fff!important;box-shadow:none!important}
.tm-kalk{border:1px solid var(--line)!important;border-radius:18px!important;box-shadow:0 26px 70px -54px rgba(27,27,34,.6)}
.tm-kalk-seg button{border:1px solid var(--line)!important;background:var(--pap)!important;border-radius:10px!important}
.tm-kalk-seg button.on{background:var(--ink)!important;border-color:var(--ink)!important;color:#fff!important}
.tm-kalk-seg button.on small{color:#D8D3CC!important}
.tm-kalk-r{background:var(--pap)!important;border:1px solid var(--line)!important;border-radius:14px!important}

/* Čipi, galerije in čustveni poudarki. */
a.tm-chip{border:1px solid var(--line);border-radius:10px}
a.tm-chip:hover{transform:translateY(-2px);box-shadow:none}
.tm-polaroid{transform:none!important;border-radius:14px!important;box-shadow:0 22px 48px -40px rgba(27,27,34,.7)!important}
.tm-emotional,.tm-emotion,.tm-quote{border-radius:16px!important;box-shadow:none!important}

/* Obrazci. */
.tm-form-sec{background:#1D1D24}
.tm-form-sec:after{background:radial-gradient(circle,rgba(199,78,45,.18),transparent 65%)}
.tm-form{border-radius:18px;box-shadow:0 38px 78px -48px rgba(0,0,0,.85)}
.tm-form input[type=text],.tm-form input[type=email],.tm-form input[type=tel],.tm-form select,.tm-form textarea{border:1px solid var(--line);border-radius:10px;background:#FBFAF8}
.tm-file{border:1px dashed #CFC5B8;border-radius:12px;background:var(--pap)}

/* Oblikovalnik: inline CSS ima prednost, zato je tu zavestno višja specifičnost. */
body .ob-top,body .ob-panel,body .ob-step,body .ob-rev-in{border:1px solid var(--line);border-radius:14px;box-shadow:none}
body .ob-top{background:#fff;padding:12px 14px}
body .ob-tabs{gap:7px}
body .ob-tabs button,body .ob-tabs select,body .ob-tools .tb,body .ob-pbtns button{
  border:1px solid var(--line);
  border-radius:9px;
  background:#fff;
  color:var(--ink);
  box-shadow:none;
}
body .ob-tabs button.on{background:var(--ink);border-color:var(--ink);color:#fff}
body .ob-stagewrap{background:linear-gradient(135deg,#F2EEE8,#E9E3DA);border:1px solid var(--line);border-radius:18px}
body .ob-panel input[type=text],body .ob-panel select,body .ob-form-sec input[type=text],body .ob-form-sec input[type=email],body .ob-form-sec input[type=tel],body .ob-form-sec input[type=number],body .ob-form-sec select,body .ob-form-sec textarea{border:1px solid var(--line);border-radius:9px}
body .ob-price{background:#F7F4EE;border:1px solid var(--line);border-radius:12px}
body .ob-step>b i{background:var(--ink);border:0;color:#fff}
body .ob-layers .row.on{background:var(--pap);outline:1px solid var(--line)}
body .ob-layers .row b{background:var(--rose);color:var(--cor-d)}

/* Noga. */
.tm-footer{background:#1A1A21;color:#AAA5AC}
.tm-footer:before{height:1px;background:rgba(255,255,255,.14)}
.tm-footer a:hover{color:#fff}
.tm-foot-giant span{color:#24242D!important;-webkit-text-stroke:0!important}

@media(max-width:980px){
  .tm-menu{inset:76px 0 auto 0;background:#fff;box-shadow:0 24px 45px -28px rgba(27,27,34,.5)}
  .tm-menu a{width:100%;text-align:center;padding:6px}
  .tm-menu .tm-btn{width:auto;padding:12px 24px}
  .tm-hero-product{max-width:760px;margin-inline:auto}
}
@media(max-width:640px){
  .tm-c,.ob-wrap{padding-left:18px!important;padding-right:18px!important}
  .tm-nav{height:68px}
  .tm-menu{inset:68px 0 auto 0}
  .tm-wordmark{font-size:19px}
  .tm-hero{padding-top:38px}
  .tm-hero h1{font-size:clamp(40px,13vw,56px)}
  .tm-hero-ctas,.tm-hero-ctas .tm-btn{width:100%}
  .tm-hero-ctas .tm-btn{justify-content:center}
  .tm-paket{padding:28px 22px}
  body .ob-tabs{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));width:100%}
  body .ob-tabs select{grid-column:1/-1;width:100%}
  body .ob-tabs button{padding:9px 8px;font-size:12px}
}

@media(prefers-reduced-motion:reduce){
  *,*:before,*:after{scroll-behavior:auto!important;animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}
}