/* Totai inner pages: page hero plate, brands, about, service, safety, FAQ, where to buy, contact, journal. */

.tt-wrap-wide { padding-inline: clamp(10px, 1.4vw, 18px); }
.tt-phero__grid { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 1.6rem 3rem; align-items: end; }
.tt-phero__plate h1 { text-shadow: 0 2px 0 var(--red-ink); }
.tt-plate--iron.tt-phero__plate h1 { text-shadow: none; }
.tt-phero__aside { display: grid; justify-items: end; gap: .3rem; }
.tt-phero__tel { font: 800 clamp(2.6rem, 2rem + 2.6vw, 4.4rem)/.9 var(--f-display); color: #fff; text-decoration: none; }
.tt-phero__mail { color: rgba(255, 255, 255, .88); }
@media (max-width: 760px) { .tt-phero__grid { grid-template-columns: minmax(0, 1fr); } .tt-phero__aside { justify-items: start; } }
.tt-phero__plate .tt-crumbs a { color: #fff; }
.tt-sztap.is-on > span { border-color: var(--red); background: #fff6f5; }

/* brand hero */
.tt-bhero { overflow: hidden; }
.tt-bhero--elba { background-color: #1c4d58; }
.tt-bhero--elica { background-color: #0e0d0d; }
.tt-bhero__grid { display: grid; grid-template-columns: minmax(0, 1.1fr) minmax(0, .9fr); gap: clamp(1.6rem, 4vw, 4rem); align-items: center; margin-top: 1.6rem; }
.tt-bhero__logo { width: clamp(150px, 16vw, 240px); color: #fff; margin-bottom: 1.6rem; }
.tt-bhero__logo svg { width: 100%; height: auto; display: block; }
.tt-bhero h1 { margin: 0 0 1rem !important; }
.tt-bhero .tt-lede { margin-bottom: 1.6rem; }
.tt-bhero__ph { width: 100%; height: auto; max-height: 560px; object-fit: cover; border-radius: var(--r-sm); }
.tt-bhero .tt-form__acts .tt-link { gap: .4rem; }
@media (max-width: 860px) { .tt-bhero__grid { grid-template-columns: minmax(0, 1fr); } .tt-bhero__ph { max-height: 360px; } }
.tt-parts__mark { display: grid; place-items: center; color: var(--ink); }
.tt-parts__mark svg { width: 70%; height: auto; }
.tt-brand--elba .tt-parts__mark { color: #1c4d58; }

/* product shelf */
.tt-pgrid { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 1px; background: var(--enamel-3); border-block: 1px solid var(--enamel-3); }
.tt-pgrid > li { background: var(--enamel); }
.tt-pcard { display: grid; gap: .5rem; height: 100%; padding: 1rem; color: var(--ink); text-decoration: none; transition: background-color .3s var(--ease); }
.tt-pcard:hover { background: #fbf9f6; }
.tt-pcard__ph { display: grid; place-items: center; aspect-ratio: 1; background: #fff; border-radius: var(--r-sm); overflow: hidden; }
.tt-pcard__ph img { width: 86%; height: 86%; object-fit: contain; transition: transform .6s var(--ease); }
.tt-pcard:hover .tt-pcard__ph img { transform: scale(1.04); }
.tt-pcard__none { color: var(--steel); }
.tt-pcard__name { font: 700 1.02rem/1.2 var(--f-cond); }
.tt-pcard__price { font: 800 1.4rem/1 var(--f-display); color: var(--red-deep); }
@media (max-width: 900px) { .tt-pgrid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }

/* brands list */
.tt-brandlist .tt-wrap { display: grid; gap: clamp(12px, 1.6vw, 20px); }
.tt-brow__a { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); min-height: 420px; border-radius: var(--r); overflow: hidden; color: #fff; text-decoration: none; background: var(--red); }
.tt-brow--elba .tt-brow__a { background: #1c4d58; }
.tt-brow--elica .tt-brow__a { background: #0e0d0d; }
.tt-brow__plate { display: grid; align-content: space-between; gap: 1rem; padding: clamp(1.4rem, 3vw, 2.6rem); }
.tt-brow__logo { width: clamp(130px, 14vw, 200px); }
.tt-brow__logo svg { width: 100%; height: auto; display: block; }
.tt-brow__tag { font: 800 clamp(2.4rem, 1.8rem + 2.4vw, 4rem)/.92 var(--f-display); }
.tt-brow__text { color: rgba(255, 255, 255, .86); max-width: 44ch; }
.tt-brow__plate .tt-btn { justify-self: start; }
.tt-brow--elba .tt-btn--white { --b-fg: #1c4d58; }
.tt-brow--elica .tt-btn--white { --b-fg: #0e0d0d; }
.tt-brow__ph { width: 100%; height: 100%; object-fit: cover; transition: transform 1.2s var(--ease); }
.tt-brow__a:hover .tt-brow__ph { transform: scale(1.03); }
@media (max-width: 760px) { .tt-brow__a { grid-template-columns: minmax(0, 1fr); } .tt-brow__ph { height: 260px; grid-row: 1; } }

/* about */
.tt-about { display: grid; grid-template-columns: minmax(0, 1.4fr) minmax(0, 1fr); gap: clamp(2rem, 5vw, 5rem); align-items: start; }
.tt-about__plate { padding: clamp(1.4rem, 3vw, 2.2rem); }
.tt-years { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 1px; background: var(--iron-line); border-block: 1px solid var(--iron-line); }
.tt-years li { background: var(--iron); padding: 1.2rem 1.2rem 1.4rem 0; }
.tt-years li + li { padding-left: 1.2rem; }
.tt-years__y { display: block; font: 800 2rem/1 var(--f-display); color: var(--glow); margin-bottom: .6rem; }
.tt-years p { color: rgba(255, 255, 255, .84); font-size: .95rem; margin: 0; }
.tt-about__pics { display: grid; grid-template-columns: 1fr 2fr 1fr; gap: clamp(10px, 1.4vw, 18px); }
.tt-about__ph { width: 100%; height: 420px; object-fit: cover; border-radius: var(--r); }
@media (max-width: 900px) {
	.tt-about { grid-template-columns: minmax(0, 1fr); }
	.tt-years { grid-template-columns: minmax(0, 1fr); }
	.tt-years li + li { padding-left: 0; }
	.tt-about__pics { grid-template-columns: 1fr 1fr; }
	.tt-about__ph { height: 260px; }
	.tt-about__ph--wide { grid-column: 1 / -1; grid-row: 1; }
}

/* service */
.tt-svc { display: grid; grid-template-columns: minmax(0, 1.6fr) minmax(0, 1fr); gap: clamp(12px, 1.6vw, 20px); align-items: start; }
.tt-svc__form { padding: clamp(1.2rem, 3vw, 2.2rem); }
.tt-tabs { display: flex; gap: .4rem; margin-bottom: 1.6rem; border-bottom: 1px solid var(--enamel-3); }
.tt-tabs button { position: relative; min-height: 48px; padding: .6rem 1rem; border: 0; background: none; cursor: pointer; font: 750 1.05rem/1 var(--f-cond); color: var(--ink-3); }
.tt-tabs button[aria-selected="true"] { color: var(--ink); }
.tt-tabs button[aria-selected="true"]::after { content: ""; position: absolute; left: .6rem; right: .6rem; bottom: -1px; height: 3px; background: var(--red); }
.tt-svc__side { display: grid; gap: clamp(12px, 1.6vw, 20px); }
.tt-svc__box { padding: clamp(1.2rem, 2.6vw, 2rem); }
.tt-svc__box p { color: rgba(255, 255, 255, .9); margin: 1rem 0 1.2rem; }
.tt-dl { list-style: none; margin: 1rem 0 0; padding: 0; border-top: 1px solid var(--iron-line); }
.tt-dl li { border-bottom: 1px solid var(--iron-line); }
.tt-dl a { display: flex; align-items: center; gap: .7rem; min-height: 50px; color: #fff; text-decoration: none; font: 650 1rem/1.2 var(--f-cond); }
.tt-dl a:hover { color: var(--glow); }
.tt-dl .tt-ic { width: 20px; height: 20px; flex: none; }
@media (max-width: 960px) { .tt-svc { grid-template-columns: minmax(0, 1fr); } }

/* safety */
.tt-safety { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.2fr); gap: clamp(1.6rem, 4vw, 4rem); align-items: start; }
.tt-safety__now { position: sticky; top: calc(var(--head-h) + 16px); }
.tt-rules { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: 1fr 1fr; gap: 1px; background: var(--enamel-3); border-block: 1px solid var(--enamel-3); }
.tt-rules li { background: var(--enamel); padding: 1.4rem 1.2rem 1.6rem 0; }
.tt-rules li:nth-child(even) { padding-left: 1.4rem; }
.tt-rules .tt-ic { width: 28px; height: 28px; color: var(--red-deep); margin-bottom: .8rem; }
.tt-rules h3 { margin-bottom: .4rem; }
.tt-rules p { margin: 0; color: var(--ink-2); font-size: .97rem; }
.tt-safety__facts .tt-h2 { margin-bottom: 1.6rem; }
@media (max-width: 900px) { .tt-safety { grid-template-columns: minmax(0, 1fr); } .tt-safety__now { position: static; } }
@media (max-width: 560px) { .tt-rules { grid-template-columns: 1fr; } .tt-rules li:nth-child(even) { padding-left: 0; } }

/* FAQ */
.tt-faq { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 2fr); gap: clamp(1.6rem, 4vw, 4rem); align-items: start; }
.tt-faq__tools { position: sticky; top: calc(var(--head-h) + 16px); display: grid; gap: 1.2rem; }
.tt-faq__tools .tt-seg span { min-height: 42px; font-size: .95rem; }
.tt-faq__list { border-top: 1px solid var(--ink); }
.tt-faq__item { border-bottom: 1px solid var(--enamel-3); }
.tt-faq__item summary { display: flex; justify-content: space-between; align-items: center; gap: 1rem; min-height: 64px; padding: .9rem 0; cursor: pointer; list-style: none; font: 750 clamp(1.05rem, 1rem + .3vw, 1.25rem)/1.25 var(--f-cond); }
.tt-faq__item summary::-webkit-details-marker { display: none; }
.tt-faq__item summary .tt-ic { flex: none; width: 22px; height: 22px; transition: transform .35s var(--ease); color: var(--red-deep); }
.tt-faq__item[open] summary .tt-ic { transform: rotate(45deg); }
.tt-faq__item summary:hover { color: var(--red-deep); }
.tt-faq__a { padding: 0 0 1.4rem; max-width: 68ch; color: var(--ink-2); }
.tt-faq__a p { white-space: pre-line; }
@media (max-width: 900px) { .tt-faq { grid-template-columns: minmax(0, 1fr); } .tt-faq__tools { position: static; } }

/* where to buy */
.tt-wtb { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.2fr); gap: clamp(12px, 1.6vw, 20px); align-items: start; }
.tt-wtb__ways { display: grid; gap: clamp(12px, 1.6vw, 20px); }
.tt-wtb__way { display: grid; gap: .8rem; padding: clamp(1.4rem, 3vw, 2.2rem); color: #fff; text-decoration: none; }
.tt-wtb__way > span:not(.tt-stamp-row):not(.tt-btn) { color: rgba(255, 255, 255, .88); }
.tt-wtb__h { font: 800 clamp(2rem, 1.6rem + 1.6vw, 3rem)/.95 var(--f-display); color: #fff !important; }
.tt-wtb__way .tt-btn { justify-self: start; }
.tt-wtb__form { padding: clamp(1.4rem, 3vw, 2.2rem); }
@media (max-width: 900px) { .tt-wtb { grid-template-columns: minmax(0, 1fr); } }

/* contact */
.tt-contact { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.2fr); gap: clamp(12px, 1.6vw, 20px); align-items: start; }
.tt-contact__nums { display: grid; gap: clamp(12px, 1.6vw, 20px); }
.tt-contact__num { display: grid; gap: .6rem; padding: clamp(1.2rem, 2.6vw, 2rem); color: #fff; text-decoration: none; }
.tt-contact__num b { font: 800 clamp(2.6rem, 2rem + 2.4vw, 4rem)/.9 var(--f-display); }
.tt-contact__num > span:last-child { color: rgba(255, 255, 255, .86); }
.tt-contact__addr { padding: .6rem 0; }
.tt-contact__addr p { margin: 0 0 .4rem; color: var(--ink-2); }
.tt-contact__addr .tt-label { color: var(--ink); }
.tt-contact__form { padding: clamp(1.4rem, 3vw, 2.2rem); }
.tt-contact__map { margin-top: clamp(1.6rem, 3vw, 2.6rem); }
.tt-contact__map iframe { display: block; width: 100%; height: 420px; border: 0; border-radius: var(--r); filter: grayscale(.4) contrast(1.05); }
@media (max-width: 900px) { .tt-contact { grid-template-columns: minmax(0, 1fr); } .tt-contact__map iframe { height: 300px; } }

/* journal + single + search */
.tt-entry { padding: 1.2rem 0; border-bottom: 1px solid var(--enamel-3); }
.tt-entry__title { font-size: 2rem; margin-bottom: .4rem; }
.tt-entry__title a { text-decoration: none; }
.tt-entry-content img { border-radius: var(--r-sm); }
.tt-results { list-style: none; margin: 0; padding: 0; border-top: 1px solid var(--ink); }
.tt-results li { border-bottom: 1px solid var(--enamel-3); }
.tt-results a { display: grid; gap: .3rem; padding: 1rem 0; text-decoration: none; color: var(--ink); }
.tt-results strong { font: 800 1.6rem/1 var(--f-display); }
.tt-results span:last-child { color: var(--ink-2); }
.tt-blog { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1px; background: var(--enamel-3); border-block: 1px solid var(--enamel-3); }
.tt-blog .tt-jcard__a { padding: 1.4rem; }
@media (max-width: 860px) { .tt-blog { grid-template-columns: minmax(0, 1fr); } }
.tt-single__head { max-width: 860px; }
.tt-single__ph { margin: 0 0 2rem; }
.tt-single__ph img { width: 100%; max-height: 520px; object-fit: cover; border-radius: var(--r); }
.nav-links { display: flex; gap: .5rem; margin-top: 2rem; }
.nav-links .page-numbers { display: inline-grid; place-items: center; min-width: 44px; height: 44px; border: 1px solid var(--steel); border-radius: 6px; text-decoration: none; color: var(--ink); font: 700 1rem/1 var(--f-cond); }
.nav-links .page-numbers.current { background: var(--ink); color: #fff; border-color: var(--ink); }
.search-form { display: flex; gap: .5rem; }
.search-form label { flex: 1; }
.search-form .search-field { width: 100%; min-height: 50px; padding: .7rem .9rem; border: 1px solid var(--steel); border-radius: var(--r-sm); font-size: 16px; }
.search-form .search-submit { min-height: 50px; padding: 0 1.2rem; border: 0; border-radius: var(--r-sm); background: var(--ink); color: #fff; font: 750 1rem/1 var(--f-cond); cursor: pointer; }
