/* TMC-157: about, contact, feedback, privacy, terms, disclaimer, sitemap and 404, as the PO's v8 mockups; scoped under .tmc90 .sp.
   Text sizes = the Palli Kathum scale; colours = the site theme. */
.tmc90{--orange:#FF7700; --orange-soft:#FFF1E2; --orange-ink:#B55D00;
  --cream:#FFFBF6; --cream-deep:#FFF3E6; --white:#FFFFFF;
  --peach:#F0D2B4; --peach-deep:#E5772A; --tan:#F5E4CF;
  --rose:#F4DBD7; --rose-ink:#BD5746;
  --green:#248D49; --green-soft:#E8F5EC; --green-ink:#0F6E3C; --red:#D14343;
  --ink:#1B1B1B; --body:#2B2524; --head:#35343D; --muted:#8A817A; --grey:#6B6259;
  --line:#E9E1D6; --rule:#ECE8E3;
  --radius-s:8px; --radius-m:12px; --radius-l:16px; --pill:32px;
  --shadow:0 4px 16px rgba(107,82,51,.08);
  --gutter:16px; --maxw:1200px;
  --lh-body:1.8; --lh-head:1.4;
  --ff-ta:'Anek Tamil','Noto Sans Tamil',system-ui,sans-serif;
  --ff-num:'Inter',system-ui,sans-serif;
  color:var(--body); font-family:var(--ff-ta); font-size:14px; line-height:var(--lh-body)}
.tmc90 *,.tmc90 *::before,.tmc90 *::after{box-sizing:border-box}
.tmc90 h1,.tmc90 h2,.tmc90 h3{color:var(--head); margin:0; line-height:var(--lh-head); font-weight:700}
.tmc90 p{margin:0; line-height:var(--lh-body)}
.tmc90 a{color:var(--orange); text-decoration:none}
.tmc90 .num{font-family:var(--ff-num)}
.tmc90 .wrap{width:100%; max-width:var(--maxw); margin:0 auto; padding:14px var(--gutter) 8px}

.tmc90 .sr{position:absolute; width:1px; height:1px; overflow:hidden; clip:rect(0 0 0 0); white-space:nowrap}
.tmc90 .crumb{font-size:12px; color:var(--muted); line-height:1.6; margin-bottom:8px}
.tmc90 .crumb a{color:var(--muted)}

.tmc90 a:hover{text-decoration:underline}
.tmc90 .crumb{font-size:12px; color:var(--muted); line-height:1.6; margin-bottom:8px}
.tmc90 .crumb a{color:var(--muted)}

/* page head */
.tmc90 .sp .ph{margin-bottom:10px}
.tmc90 .sp .ph h1{font-size:25px; line-height:1.4}
.tmc90 .sp .ph h1 .sub{display:block; font-size:13px; font-weight:500; color:var(--muted); line-height:1.5; margin-top:2px}
@media (min-width:760px){.tmc90 .sp .ph h1{font-size:32px}}

/* the text */
.tmc90 .doc{max-width:760px}
.tmc90 .doc h2{font-size:19px; margin:26px 0 8px; line-height:1.35}
.tmc90 .doc h3{font-size:15.5px; margin:18px 0 6px}
.tmc90 .doc p,.tmc90 .doc li{font-size:15px; line-height:1.8; overflow-wrap:anywhere}
.tmc90 .doc p{margin:0 0 10px}
.tmc90 .doc ul{padding-left:20px; margin:0 0 10px; list-style:disc}
.tmc90 .doc li{margin-bottom:5px}
.tmc90 .doc .upd{font-size:12.5px; color:var(--muted); margin:-4px 0 14px}
.tmc90 .doc .box{background:var(--cream-deep); border:1px solid #F1DEC6; border-radius:var(--radius-m); padding:12px 14px; margin:12px 0; font-size:15px; line-height:1.8}
.tmc90 .doc details.enver{margin:18px 0 0; border-top:1px solid var(--line); padding-top:10px; font-family:var(--ff-num)}
.tmc90 .doc details.enver summary{cursor:pointer; font-weight:600; font-size:14px; color:var(--muted); list-style:none; display:flex; align-items:center; gap:6px}
.tmc90 .doc details.enver summary::-webkit-details-marker{display:none}
.tmc90 .doc details.enver summary::before{content:'▸'; font-size:12px}
.tmc90 .doc details.enver[open] summary::before{content:'▾'}
.tmc90 .doc details.enver p{font-size:14px; line-height:1.75; margin:8px 0 0}
.tmc90 .doc .toc{display:flex; flex-wrap:wrap; gap:6px; margin:4px 0 12px}
.tmc90 .doc .toc a{font-size:12.5px; border:1px solid var(--line); border-radius:var(--pill); padding:4px 11px; color:var(--orange-ink); background:#fff; line-height:1.5}
.tmc90 .doc h2[id]{scroll-margin-top:140px}

/* the cookie table: the site's table (rose head in a box on desktop; on phones no head, cream every second row) */
.tmc90 .doc table.kv{width:100%; border-collapse:collapse; font-size:13.5px; margin:8px 0 14px}
.tmc90 .doc table.kv th,.tmc90 .doc table.kv td{padding:8px 10px; border-bottom:1px solid var(--rule); text-align:left; vertical-align:top; line-height:1.6}
.tmc90 .doc table.kv th{color:var(--rose-ink); background:var(--rose); font-size:12.5px}
@media (max-width:600px){.tmc90 .doc table.kv thead{display:none}
  .tmc90 .doc table.kv,.tmc90 .doc table.kv tbody,.tmc90 .doc table.kv tr,.tmc90 .doc table.kv td{display:block; width:100%}
  .tmc90 .doc table.kv tr{padding:8px 10px; border-bottom:1px solid var(--rule)} .tmc90 .doc table.kv tr:nth-child(even){background:var(--cream)}
  .tmc90 .doc table.kv td{padding:0; border:0} .tmc90 .doc table.kv td:first-child{font-weight:700; color:var(--head)}
  .tmc90 .doc table.kv td:last-child{color:var(--muted); font-size:12.5px}}

/* the three "ways" cards on contact / feedback */
.tmc90 .ways{display:grid; grid-template-columns:1fr; gap:8px; margin:8px 0 6px}
@media (min-width:700px){.tmc90 .ways{grid-template-columns:repeat(3,1fr)}}
.tmc90 .ways div{border:1px solid var(--line); border-radius:var(--radius-m); padding:11px 12px; font-size:13.5px; line-height:1.6; background:#fff}
.tmc90 .ways b{display:block; color:var(--head); font-size:14.5px; margin-bottom:2px}

/* forms */
.tmc90 .form{display:grid; gap:12px; max-width:560px; margin:14px 0; position:relative}
.tmc90 .form label{display:block; font-size:13.5px; font-weight:600; color:var(--head); margin-bottom:4px; line-height:1.4}
.tmc90 .form input,.tmc90 .form select,.tmc90 .form textarea{width:100%; font:inherit; font-size:15px; padding:11px 12px; border:1px solid var(--line); border-radius:10px;
  background:#fff; color:var(--body); line-height:1.4}
.tmc90 .form select{appearance:auto}
.tmc90 .form textarea{min-height:140px; resize:vertical}
.tmc90 .form input:focus,.tmc90 .form select:focus,.tmc90 .form textarea:focus{outline:2px solid var(--orange); border-color:var(--orange)}
.tmc90 .form .bad{border-color:var(--red)}
.tmc90 .form .chk{display:flex; gap:9px; align-items:flex-start; font-size:13.5px; font-weight:500; line-height:1.6; color:var(--grey)}
.tmc90 .form .chk input{width:18px; height:18px; margin-top:3px; flex:0 0 auto}
.tmc90 .form button{font:inherit; font-size:15px; font-weight:700; color:#fff; background:var(--orange); border:0; border-radius:var(--pill); padding:12px 22px; cursor:pointer; min-height:46px}
.tmc90 .form button:hover{background:var(--orange-ink)}
.tmc90 .form .hp{position:absolute; left:-9999px; width:1px; height:1px; overflow:hidden}
.tmc90 .form .msg{display:none; padding:10px 12px; border-radius:10px; font-size:14px}
.tmc90 .form .msg.ok{display:block; background:var(--green-soft); color:var(--green-ink)}
.tmc90 .form .msg.err{display:block; background:#FFF0ED; color:var(--rose-ink)}
/* feedback type: the site's pills (chosen = orange filled) */
.tmc90 .seg{display:grid; grid-template-columns:1fr 1fr; gap:6px}
@media (min-width:600px){.tmc90 .seg{grid-template-columns:repeat(4,1fr)}}
.tmc90 .seg label{margin:0; cursor:pointer; position:relative}
.tmc90 .seg input{position:absolute; opacity:0; width:0; height:0}
.tmc90 .seg span{display:block; text-align:center; border:1px solid var(--line); border-radius:var(--pill); padding:9px 10px; font-size:13.5px; font-weight:600; color:var(--head); background:#fff; line-height:1.4}
.tmc90 .seg input:checked + span{background:var(--orange); border-color:var(--orange); color:#fff}
.tmc90 .seg input:focus-visible + span{outline:2px solid var(--orange-ink)}

/* sitemap */
.tmc90 .doc .smap ul{columns:2 260px; column-gap:28px}
.tmc90 .doc .smap li{break-inside:avoid}

/* 404 */
.tmc90 .nf{text-align:center; padding:30px 0 10px}
.tmc90 .nf .big{display:block; font:800 64px var(--ff-num); color:var(--orange); line-height:1}
.tmc90 .nf h1{font-size:22px; margin:8px 0 4px}
.tmc90 .nf p{font-size:15px; line-height:1.8; max-width:520px; margin:10px auto 16px}
.tmc90 .nf p.note{font-size:13.5px; color:var(--muted)}
.tmc90 .nf .ql{display:flex; flex-wrap:wrap; gap:8px; justify-content:center}
.tmc90 .nf .ql a{border:1px solid var(--line); border-radius:var(--pill); padding:8px 14px; font-size:14px; font-weight:600; color:var(--orange-ink); background:#fff; line-height:1.5}
.tmc90 .nf .ql a::after{content:" ›"}
